:root{--hn-purple:#8b5cf6;--hn-bg:#08080a;--hn-panel:#111116;--hn-line:#26262e;--hn-text:#f5f5f7;--hn-muted:#a2a2ad} .hnf-app-shell{min-height:100vh;background:var(--hn-bg);color:var(--hn-text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;margin:0}.hnf-app-top{height:72px;border-bottom:1px solid var(--hn-line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#09090b}.hnf-logo{font-weight:800;letter-spacing:.03em;font-size:22px}.hnf-logo span{color:var(--hn-purple)}.hnf-top-user{color:var(--hn-muted);font-size:14px}.hnf-top-user a{color:#fff;margin-left:15px}.hnf-app-body{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 72px)}.hnf-sidebar{border-right:1px solid var(--hn-line);padding:22px 14px;display:flex;flex-direction:column;gap:6px}.hnf-sidebar button,.hnf-sidebar a{background:transparent;border:0;color:#a9a9b4;text-align:left;padding:13px 14px;border-radius:8px;text-decoration:none;font-size:14px;cursor:pointer}.hnf-sidebar button:hover,.hnf-sidebar button.active,.hnf-sidebar a:hover{background:#18181f;color:#fff}.hnf-main{padding:34px;max-width:1200px;width:100%;box-sizing:border-box}.hnf-tab{display:none}.hnf-tab.active{display:block}.hnf-hero-small{border:1px solid var(--hn-line);background:linear-gradient(135deg,#15131c,#0d0d10);padding:30px;border-radius:16px;margin-bottom:20px}.hnf-hero-small p{font-size:11px;letter-spacing:.2em;color:var(--hn-purple);margin:0 0 8px}.hnf-hero-small h1{font-size:34px;margin:0 0 6px}.hnf-hero-small span{color:var(--hn-muted)}.hnf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.hnf-panel,.hnf-list{border:1px solid var(--hn-line);background:var(--hn-panel);border-radius:14px;padding:22px}.hnf-panel{display:flex;flex-direction:column;gap:7px}.hnf-panel small{color:var(--hn-muted);letter-spacing:.12em}.hnf-panel strong{font-size:32px}.hnf-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.hnf-section-head h2{margin:0;font-size:28px}.hnf-btn{display:inline-block;background:var(--hn-purple);color:#fff!important;border:0;border-radius:7px;padding:11px 16px;text-decoration:none;font-weight:700;cursor:pointer}.hnf-row{display:flex;justify-content:space-between;align-items:center;padding:15px 0;border-bottom:1px solid var(--hn-line)}.hnf-row:last-child{border-bottom:0}.hnf-row strong,.hnf-row span{display:block}.hnf-row span{color:var(--hn-muted);font-size:13px;margin-top:4px}.hnf-row a{color:#c4aaff}.hnf-empty,.hnf-login-card{border:1px solid var(--hn-line);background:var(--hn-panel);border-radius:16px;padding:30px}.hnf-login-card{max-width:440px;margin:80px auto;text-align:center}.hnf-login-card h1{font-size:32px}.hnf-login-card p{color:var(--hn-muted);line-height:1.6}.hnf-login-card .hnf-btn{display:block;margin:25px 0 16px}.hnf-back{color:#aaa;text-decoration:none;font-size:13px}@media(max-width:800px){.hnf-app-body{grid-template-columns:1fr}.hnf-sidebar{border-right:0;border-bottom:1px solid var(--hn-line);display:grid;grid-template-columns:repeat(3,1fr);padding:10px}.hnf-main{padding:20px}.hnf-grid{grid-template-columns:1fr}.hnf-top-user{display:none}.hnf-app-top{padding:0 18px}.hnf-sidebar a{grid-column:1/-1}.hnf-section-head{gap:10px}.hnf-section-head h2{font-size:23px}} .hnf-trainer-app{max-width:1100px;margin:40px auto;padding:0 18px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif} .hnf-trainer-card{background:#0f0f14;color:#fff;border:1px solid #25252d;border-radius:18px;padding:28px} .hnf-trainer-brand{font-weight:800;letter-spacing:.08em;margin-bottom:18px}.hnf-trainer-brand span{color:#8b5cf6} .hnf-trainer-card input{width:100%;box-sizing:border-box;padding:13px 14px;margin:8px 0;border-radius:9px;border:1px solid #33333b;background:#17171d;color:#fff} .hnf-trainer-card button{padding:12px 18px;border:0;border-radius:9px;background:#8b5cf6;color:#fff;font-weight:700;cursor:pointer} .hnf-trainer-head{display:flex;justify-content:space-between;align-items:center;gap:15px} .hnf-trainer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:22px 0} .hnf-trainer-stat{padding:20px;border:1px solid #2a2a33;background:#15151b;border-radius:14px} .hnf-trainer-stat strong{display:block;font-size:30px}.hnf-trainer-stat span{display:block;color:#aaa;margin-top:4px} @media(max-width:800px){.hnf-trainer-grid{grid-template-columns:1fr 1fr}.hnf-trainer-head{align-items:flex-start;flex-direction:column}} .hnf-muted{color:#9d9daa;margin:.25rem 0 0} .hnf-nav-card{width:100%;text-align:left} .hnf-nav-card.active{outline:2px solid #8b5cf6} .hnf-panel{display:none;margin-top:22px;border:1px solid #25252d;background:#111118;border-radius:16px;padding:20px} .hnf-panel.active{display:block} .hnf-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px} .hnf-panel-head h3{margin:0} .hnf-list{display:flex;flex-direction:column} .hnf-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 0;border-bottom:1px solid #25252d} .hnf-row:last-child{border-bottom:0} .hnf-row strong,.hnf-row span{display:block}.hnf-row span{color:#999;margin-top:4px;font-size:13px} .hnf-pill{background:#21183b!important;color:#c8b5ff!important;border-radius:999px;padding:5px 9px} .hnf-empty{color:#888;padding:18px 0} .hnf-modal{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:20px} .hnf-modal[hidden]{display:none} .hnf-modal-card{width:min(620px,100%);max-height:90vh;overflow:auto;background:#111118;color:#fff;border:1px solid #31313b;border-radius:16px;padding:24px;position:relative} .hnf-modal-close{position:absolute;right:16px;top:12px;background:transparent!important;font-size:28px;padding:0!important} .hnf-modal-card label{display:block;margin-top:12px;margin-bottom:5px;color:#bbb;font-size:13px} .hnf-modal-card input,.hnf-modal-card select,.hnf-modal-card textarea{width:100%;box-sizing:border-box;background:#181820;border:1px solid #353540;color:#fff;border-radius:8px;padding:11px} .hnf-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px} .hnf-modal-card .secondary,.hnf-row .secondary{background:#25252d;color:#fff} .hnf-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px} #hnf-trainer-status.error{color:#ff9a9a} @media(max-width:950px) and (orientation:portrait){.hnf-form-grid{grid-template-columns:1fr}.hnf-row{align-items:flex-start;flex-direction:column}} .hnf-password-wrap{position:relative} .hnf-password-wrap input{padding-right:78px!important} .hnf-password-toggle{position:absolute!important;right:8px;top:50%;transform:translateY(-50%);padding:7px 10px!important;background:#25252d!important;font-size:12px!important} .hnf-login-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px} .hnf-link-button{background:transparent!important;color:#bba6ff!important;padding:8px 2px!important;font-weight:600!important} .hnf-link-button:hover{text-decoration:underline} /* v1.8 exercise library */ .hnf-exercise-tools{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;margin-bottom:14px} .hnf-exercise-tools input,.hnf-exercise-tools select{width:100%;box-sizing:border-box;background:#181820;border:1px solid #353540;color:#fff;border-radius:8px;padding:11px} .hnf-row-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .hnf-small-btn{padding:8px 10px!important;border-radius:8px!important;text-decoration:none!important;font-size:12px!important} .hnf-row-actions .danger{background:#3a171c!important;color:#ffb4bd!important} .hnf-password-wrap{position:relative!important} .hnf-password-wrap .hnf-password-toggle{position:absolute!important;right:8px!important;top:50%!important;transform:translateY(-50%)!important;margin:0!important;z-index:2} .hnf-password-wrap input{padding-right:78px!important} @media(max-width:750px){.hnf-exercise-tools{grid-template-columns:1fr}.hnf-row-actions{width:100%}} /* v1.9 Workout Builder */ .hnf-workout-card{border:1px solid #2a2a33;border-radius:14px;margin:12px 0;background:#15151b;overflow:hidden} .hnf-workout-title{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px} .hnf-workout-title strong,.hnf-workout-title span{display:block}.hnf-workout-title span{color:#999;margin-top:4px;font-size:13px} .hnf-workout-items{border-top:1px solid #2a2a33} .hnf-workout-item{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;padding:13px 16px;border-bottom:1px solid #25252d} .hnf-workout-item:last-child{border-bottom:0} .hnf-drag-num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#24242d;color:#aaa;font-weight:700} .hnf-workout-item-main strong,.hnf-workout-item-main span,.hnf-workout-item-main small{display:block} .hnf-workout-item-main span{color:#aaa;font-size:13px;margin-top:3px}.hnf-workout-item-main small{color:#858591;margin-top:4px} @media(max-width:800px){.hnf-workout-title{align-items:flex-start;flex-direction:column}.hnf-workout-item{grid-template-columns:34px 1fr}.hnf-workout-item .hnf-row-actions{grid-column:1/-1}} /* v2.0 Program Builder */ .hnf-program-card{border:1px solid #2a2a33;border-radius:14px;margin:12px 0;background:#15151b;overflow:hidden} .hnf-program-card .hnf-workout-items{border-top:1px solid #2a2a33} .hnf-modal-note{color:#aaa;background:#181820;border:1px solid #30303a;padding:10px 12px;border-radius:8px;line-height:1.5} .hnf-invite-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px} .hnf-mail-link{display:inline-block;background:#25252d;color:#fff!important;text-decoration:none;padding:12px 16px;border-radius:8px;font-weight:700} .hnf-mail-link:hover{background:#30303a} /* v2.2 automatic invitation email */ .hnf-success-note{border-color:#245c3a!important;background:#13261b!important;color:#b7f3c8!important} .hnf-invite-actions button:disabled{opacity:.55;cursor:wait} /* v2.3 Client invitation / Supabase portal */ .hnf-client-app{max-width:1100px;margin:40px auto;padding:0 18px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif} .hnf-client-card{background:#0f0f14;color:#fff;border:1px solid #25252d;border-radius:18px;padding:28px;box-shadow:0 16px 40px rgba(0,0,0,.25)} .hnf-client-card input{width:100%;box-sizing:border-box;padding:13px 14px;margin:8px 0;border-radius:9px;border:1px solid #33333b;background:#17171d;color:#fff} .hnf-client-card button{padding:12px 18px;border:0;border-radius:9px;background:#8b5cf6;color:#fff;font-weight:700;cursor:pointer} .hnf-client-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0} .hnf-client-program-card{border:1px solid #2a2a33;border-radius:14px;margin:12px 0;background:#15151b;overflow:hidden} #hnf-client-status.error{color:#ff9a9a} @media(max-width:700px){.hnf-client-grid{grid-template-columns:1fr}} /* v2.3.1 client signup feedback */ .hnf-inline-status{margin:14px 0;padding:12px 14px;border-radius:9px;background:#181820;border:1px solid #353540;color:#ddd;line-height:1.45} .hnf-inline-status.error{background:#35191d;border-color:#6b2a33;color:#ffb8c0} .hnf-inline-status.success{background:#13261b;border-color:#245c3a;color:#b7f3c8} #hnf-client-signup-btn:disabled{opacity:.65;cursor:wait} /* v2.3.2 session switching */ #hnf-client-session-switch{padding:4px 0 8px} #hnf-client-session-switch button:disabled{opacity:.65;cursor:wait} /* v2.4.0 Client Dashboard */ .hnf-client-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))} .hnf-client-nav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0} .hnf-client-nav-btn{background:#1a1a22!important;color:#c7c7cf!important;border:1px solid #30303b!important} .hnf-client-nav-btn.active{background:#8b5cf6!important;color:#fff!important;border-color:#8b5cf6!important} .hnf-client-view{margin-top:16px} .hnf-workout-item.hnf-open-workout{width:100%;text-align:left;display:flex;align-items:center;gap:12px;background:#14141a!important;border:1px solid #292932!important;padding:14px!important} .hnf-client-workout-card{background:#14141a;border:1px solid #2b2b35;border-radius:14px;padding:18px;margin:14px 0} .hnf-client-exercise-list{display:grid;gap:12px;margin-top:14px} .hnf-client-exercise{display:flex;gap:12px;padding:14px;border:1px solid #292932;border-radius:12px;background:#101015} .hnf-client-exercise-number{min-width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#8b5cf6;font-weight:800} .hnf-client-exercise-body{min-width:0;flex:1} .hnf-client-exercise-head{display:flex;justify-content:space-between;gap:12px;align-items:center} .hnf-client-exercise-head strong{font-size:1.05rem} .hnf-client-exercise-body>span,.hnf-prescription{display:block;color:#a9a9b2;margin-top:4px} .hnf-client-exercise-body p{margin:9px 0 0} .hnf-client-video{color:#b99cff;text-decoration:underline} .hnf-client-exercise-img{max-width:240px;width:100%;border-radius:10px;margin-top:12px} .hnf-complete-workout{white-space:nowrap} .hnf-complete-workout.is-complete{background:#1f7a47!important} .hnf-progress-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px} .hnf-progress-card{background:#14141a;border:1px solid #2b2b35;border-radius:14px;padding:18px;margin:14px 0} .hnf-progress-card input,.hnf-progress-card select,.hnf-progress-card textarea{width:100%;box-sizing:border-box;margin:6px 0;padding:12px;border-radius:9px;border:1px solid #34343e;background:#191920;color:#fff} .hnf-progress-card textarea{min-height:90px;resize:vertical} .hnf-progress-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px} .hnf-measurement-table{display:grid;gap:2px} .hnf-measurement-row{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:8px;padding:10px;border-radius:8px} .hnf-measurement-row:nth-child(even){background:#191920} .hnf-measurement-head{font-weight:800;color:#b99cff} .hnf-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} .hnf-photo-card{margin:0;background:#101015;border:1px solid #292932;border-radius:12px;overflow:hidden} .hnf-photo-card img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block} .hnf-photo-card figcaption{padding:10px;color:#b8b8c0} @media(max-width:800px){ .hnf-client-grid-4{grid-template-columns:1fr 1fr} .hnf-progress-columns{grid-template-columns:1fr} .hnf-photo-grid{grid-template-columns:1fr 1fr} } @media(max-width:520px){ .hnf-progress-form-grid{grid-template-columns:1fr} .hnf-photo-grid{grid-template-columns:1fr} .hnf-measurement-row{grid-template-columns:1fr 1fr} .hnf-measurement-head{display:none} .hnf-client-exercise-head{align-items:flex-start;flex-direction:column} } /* v2.5.0 Trainer Client Management */ .hnf-client-manage-row{align-items:center} .hnf-client-profile-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:4px 0 18px} .hnf-client-profile-summary>div{background:#17171e;border:1px solid #2d2d37;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:5px} .hnf-client-profile-summary span{color:#b6b6bf} .hnf-client-admin-list{display:grid;gap:8px;margin-bottom:18px} .hnf-client-admin-item{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#16161d;border:1px solid #2b2b35;border-radius:10px;padding:12px} .hnf-client-admin-item div{display:flex;flex-direction:column;gap:4px} .hnf-client-admin-item span{color:#aaaab3} .hnf-admin-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .hnf-admin-photo-grid a{display:flex;flex-direction:column;gap:6px;color:#cfcfd6;text-decoration:none} .hnf-admin-photo-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px;border:1px solid #30303a} @media(max-width:700px){ .hnf-client-profile-summary{grid-template-columns:1fr 1fr} .hnf-admin-photo-grid{grid-template-columns:1fr 1fr} .hnf-client-manage-row{align-items:flex-start;flex-direction:column} } /* v2.6.0 Trainer / Client Login Switching */ .hnf-role-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px} .hnf-role-choice{display:flex!important;flex-direction:column;align-items:flex-start!important;text-align:left!important;gap:7px;padding:20px!important;background:#17171f!important;border:1px solid #343442!important;border-radius:14px!important;color:#fff!important;text-decoration:none!important} .hnf-role-choice:hover{border-color:#8b5cf6!important;transform:translateY(-1px)} .hnf-role-choice strong{font-size:1.15rem} .hnf-role-choice span{font-size:.9rem;color:#aaaab5;font-weight:400} .hnf-role-link,.hnf-role-link-button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important} .hnf-role-link-button{background:#8b5cf6;color:#fff!important;border-radius:8px;padding:11px 15px;font-weight:700} #hnf-trainer-role-switch{padding:8px 0} @media(max-width:560px){ .hnf-role-choice-grid{grid-template-columns:1fr} .hnf-role-choice{padding:16px!important} } /* v2.7.0 Client Coaching Workspace */ .hnf-client-workspace-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 18px} .hnf-inline-assign{display:flex;gap:8px;align-items:center;flex:1;min-width:420px} .hnf-inline-assign select,.hnf-inline-assign input{margin:0!important;min-width:0} .hnf-inline-assign select{flex:1} .hnf-client-program-workspace{display:grid;gap:14px;margin-bottom:20px} .hnf-client-program-manage-card{border:1px solid #30303a;background:#131319;border-radius:14px;overflow:hidden} .hnf-client-program-manage-head{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:15px 16px;border-bottom:1px solid #292932} .hnf-client-program-manage-head>div:first-child{display:flex;flex-direction:column;gap:4px} .hnf-client-program-manage-head span{color:#a9a9b3} .hnf-client-week-list{padding:10px} .hnf-client-week-workout{border:1px solid #292932;border-radius:10px;background:#101015;margin:8px 0} .hnf-client-week-workout summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;padding:12px 14px;align-items:center} .hnf-client-week-workout summary span{color:#b7b7c0} .hnf-client-workout-manage-body{padding:0 14px 14px} .hnf-client-program-exercise{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 0;border-top:1px solid #25252d} .hnf-client-program-exercise>div{display:flex;flex-direction:column;gap:3px} .hnf-client-program-exercise span,.hnf-client-program-exercise small{color:#aaaab3} @media(max-width:760px){ .hnf-inline-assign{min-width:100%;flex-direction:column;align-items:stretch} .hnf-client-program-manage-head,.hnf-client-program-exercise{align-items:flex-start;flex-direction:column} .hnf-client-week-workout summary{align-items:flex-start;flex-direction:column} } /* v2.9.0 Client Workout Logging */ .hnf-set-logger{margin-top:14px;border:1px solid #2b2b35;border-radius:10px;overflow:hidden} .hnf-set-head,.hnf-set-row{display:grid;grid-template-columns:56px 1fr 1fr 76px;gap:8px;align-items:center;padding:8px 10px} .hnf-set-head{background:#1b1b23;color:#aaaab5;font-size:.82rem;font-weight:700} .hnf-set-row{border-top:1px solid #272730} .hnf-set-row.is-done{background:rgba(54,160,96,.08)} .hnf-set-row input{margin:0!important;width:100%;box-sizing:border-box;padding:8px!important} .hnf-save-set{padding:8px 10px!important} .hnf-save-set.is-done{background:#247a48!important} .hnf-workout-client-notes{margin-top:14px} .hnf-workout-client-notes label{display:block;font-weight:700;margin-bottom:6px} .hnf-session-notes{width:100%;box-sizing:border-box;min-height:80px;background:#17171e;color:#fff;border:1px solid #30303a;border-radius:9px;padding:10px} .hnf-start-workout{background:#252530!important} @media(max-width:560px){ .hnf-set-head,.hnf-set-row{grid-template-columns:38px 1fr 1fr 58px;gap:5px;padding:7px} .hnf-set-row input{padding:7px!important} .hnf-save-set{padding:7px!important;font-size:.78rem} } /* v3.0.0 Trainer Workout Results */ .hnf-session-results{display:grid;gap:10px;margin-bottom:20px} .hnf-session-result{border:1px solid #2d2d37;border-radius:12px;background:#121218;overflow:hidden} .hnf-session-result summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 14px} .hnf-session-result summary>div:first-child{display:flex;flex-direction:column;gap:4px} .hnf-session-result summary span{color:#aaaab3} .hnf-session-result.is-complete{border-left:3px solid #2f9d61} .hnf-session-result.is-progress{border-left:3px solid #8b5cf6} .hnf-session-result-summary{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end} .hnf-session-result-summary span{background:#1c1c24;border:1px solid #30303a;border-radius:999px;padding:5px 8px;font-size:.8rem} .hnf-session-result-body{padding:0 14px 14px} .hnf-session-exercise-result{border-top:1px solid #292932;padding:12px 0} .hnf-session-exercise-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px} .hnf-session-exercise-head span{color:#aaaab3} .hnf-session-set-table{border:1px solid #292932;border-radius:9px;overflow:hidden} .hnf-session-set-row{display:grid;grid-template-columns:70px 1fr 1fr 1fr;gap:8px;padding:8px 10px} .hnf-session-set-row+.hnf-session-set-row{border-top:1px solid #272730} .hnf-session-set-head{font-weight:700;background:#1a1a22;color:#b9b9c2} .hnf-session-note{margin-top:10px;padding:10px;border-radius:9px;background:#18181f} .hnf-session-note p{margin:5px 0 0;color:#b7b7c0} .hnf-session-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;color:#90909a;font-size:.82rem} @media(max-width:620px){ .hnf-session-result summary,.hnf-session-exercise-head{align-items:flex-start;flex-direction:column} .hnf-session-result-summary{justify-content:flex-start} .hnf-session-set-row{grid-template-columns:44px 1fr 1fr 72px} } /* v3.0.1 Set Autosave */ .hnf-workout-save-hint{margin-top:12px;padding:9px 10px;border:1px solid #2d2d37;border-radius:9px;color:#aaaab5;background:#15151c;font-size:.84rem} /* v3.1.0 Progress Tracking */ .hnf-progress-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px} .hnf-progress-summary>div{background:#16161d;border:1px solid #2d2d37;border-radius:11px;padding:12px;display:flex;flex-direction:column;gap:4px} .hnf-progress-summary span,.hnf-progress-summary small{color:#9d9da7} .hnf-progress-summary strong{font-size:1.18rem} .hnf-trend-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px} .hnf-mini-chart{background:#14141b;border:1px solid #2b2b34;border-radius:10px;padding:8px;min-height:150px} .hnf-mini-chart svg{width:100%;height:auto;display:block} .hnf-chart-axis{stroke:#393943;stroke-width:1} .hnf-chart-line{fill:none;stroke:currentColor;stroke-width:3} .hnf-chart-dots circle{fill:currentColor} .hnf-chart-label{fill:#9999a4;font-size:11px} .hnf-chart-single{height:145px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px} .hnf-chart-single strong{font-size:1.5rem} .hnf-chart-single span{color:#9999a4} .hnf-measurement-scroll{overflow-x:auto} .hnf-measurement-table-wide{min-width:1000px} .hnf-measurement-table-wide .hnf-measurement-row{grid-template-columns:1.2fr repeat(8,1fr)} .hnf-photo-preview-wrap{margin:10px 0} .hnf-photo-preview-wrap img{max-width:220px;max-height:260px;object-fit:cover;border-radius:10px;border:1px solid #30303a} #hnf-photo-file{width:100%;box-sizing:border-box} .hnf-trainer-checkin-item small{color:#9999a4;margin-top:3px} @media(max-width:760px){ .hnf-progress-summary{grid-template-columns:1fr 1fr} .hnf-trend-grid{grid-template-columns:1fr} } /* v3.2.0 Trainer Progress Dashboard */ .hnf-modal-card:has(.hnf-trainer-progress-dashboard){width:min(1040px,96vw)} .hnf-trainer-progress-dashboard{margin:24px 0;display:grid;gap:14px} .hnf-workspace-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px} .hnf-workspace-section-head h3,.hnf-workspace-section-head h4{margin:0}.hnf-workspace-section-head p{margin:4px 0 0} .hnf-progress-count{background:#24242e;border:1px solid #343440;border-radius:999px;padding:7px 10px;color:#c9c9d2;white-space:nowrap} .hnf-trainer-progress-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .hnf-trainer-progress-cards>div,.hnf-trainer-progress-panel{background:#16161e;border:1px solid #30303a;border-radius:12px;padding:14px} .hnf-trainer-progress-cards>div{display:flex;flex-direction:column;gap:5px}.hnf-trainer-progress-cards span{color:#9d9da7;font-size:12px}.hnf-trainer-progress-cards strong{font-size:20px} .hnf-trainer-trends{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hnf-trainer-progress-panel h4{margin:0 0 12px} .hnf-trainer-progress-panel svg{width:100%;height:auto;display:block;color:#8b5cf6}.hnf-trainer-progress-panel svg text{fill:#9999a4;font-size:11px} .hnf-trainer-chart-axis{stroke:#393943;stroke-width:1}.hnf-trainer-chart-line{fill:none;stroke:currentColor;stroke-width:3}.hnf-trainer-progress-panel svg circle{fill:currentColor} .hnf-trainer-chart-single{min-height:130px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px}.hnf-trainer-chart-single strong{font-size:24px}.hnf-trainer-chart-single span{color:#9999a4} .hnf-compare-table{overflow:hidden;border:1px solid #30303a;border-radius:10px}.hnf-compare-row{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:10px;padding:10px 12px;border-top:1px solid #292932}.hnf-compare-row:first-child{border-top:0}.hnf-compare-head{background:#202029;color:#aaa;font-size:12px;font-weight:700} .hnf-checkin-history summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none}.hnf-checkin-history summary::-webkit-details-marker{display:none}.hnf-checkin-history summary span{color:#a98bff;font-size:12px}.hnf-checkin-history[open] summary{margin-bottom:12px} .hnf-progress-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.hnf-progress-gallery a{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:#bbb}.hnf-progress-gallery img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;border:1px solid #30303a}.hnf-progress-gallery span{font-size:12px} @media(max-width:760px){.hnf-trainer-progress-cards{grid-template-columns:1fr 1fr}.hnf-trainer-trends{grid-template-columns:1fr}.hnf-compare-row{grid-template-columns:1.2fr repeat(3,1fr);font-size:12px}} /* v3.3.0 Advanced Trainer Progress */ .hnf-trainer-trends-three{grid-template-columns:repeat(3,minmax(0,1fr))} .hnf-trainer-chart-single small{color:#777782;margin-top:4px} .hnf-trainer-progress-cards small{color:#a7a7b0} .hnf-photo-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px} .hnf-photo-compare figure{margin:0;background:#111117;border:1px solid #2d2d37;border-radius:12px;overflow:hidden} .hnf-photo-compare img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block} .hnf-photo-compare figcaption{display:flex;justify-content:space-between;gap:10px;padding:10px 12px} .hnf-photo-compare figcaption span{color:#9999a4;font-size:12px} @media(max-width:980px){.hnf-trainer-trends-three{grid-template-columns:1fr}} @media(max-width:620px){.hnf-photo-compare{grid-template-columns:1fr}} /* v3.4.0 Goals & Targets */ .hnf-modal-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px} .hnf-trainer-targets{margin:20px 0;display:grid;gap:12px;background:#15151c;border:1px solid #30303a;border-radius:12px;padding:14px} .hnf-target-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .hnf-target-summary-grid>div{background:#1b1b23;border:1px solid #30303a;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:5px} .hnf-target-summary-grid span{color:#9999a4;font-size:12px}.hnf-target-summary-grid strong{font-size:17px} #hnf-client-targets{display:grid;gap:12px} .hnf-client-target-item{border:1px solid #30303a;background:#15151c;border-radius:11px;padding:12px} .hnf-target-line{display:flex;justify-content:space-between;gap:12px;align-items:center} .hnf-target-line>div{display:flex;flex-direction:column;gap:4px}.hnf-target-line span{color:#9d9da7;font-size:12px} .hnf-target-line strong{font-size:17px}.hnf-target-line strong em{font-style:normal;color:#a98bff;font-weight:600}.hnf-target-line>b{font-size:16px;color:#a98bff} .hnf-target-progress{height:9px;background:#25252e;border-radius:999px;overflow:hidden;margin:10px 0 7px}.hnf-target-progress i{display:block;height:100%;background:#8b5cf6;border-radius:999px} .hnf-client-target-item small{color:#9999a4}.hnf-target-date{padding:10px 12px;border-radius:9px;background:#1b1b23;color:#aaa} @media(max-width:760px){.hnf-target-summary-grid{grid-template-columns:1fr 1fr}.hnf-modal-grid-2{grid-template-columns:1fr}} /* v3.5.0 Client Goal Progress Dashboard */ .hnf-goal-dashboard{gap:16px} .hnf-goal-overview{display:grid;grid-template-columns:1fr 1fr;gap:10px} .hnf-goal-deadline,.hnf-goal-metric{background:#1b1b23;border:1px solid #30303a;border-radius:11px;padding:12px;display:flex;flex-direction:column;gap:5px} .hnf-goal-deadline span,.hnf-goal-metric span{font-size:12px;color:#9898a3} .hnf-goal-deadline strong,.hnf-goal-metric strong{font-size:20px} .hnf-goal-deadline small,.hnf-goal-metric small{color:#a2a2ad} .hnf-goal-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .hnf-goal-card{background:#181820;border:1px solid #30303a;border-radius:12px;padding:12px} .hnf-goal-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px} .hnf-goal-card-head>div{display:flex;flex-direction:column;gap:4px} .hnf-goal-card-head span{color:#9b9ba6;font-size:12px} .hnf-goal-card-head strong{font-size:17px} .hnf-goal-card-head strong em{font-style:normal;color:#ad8cff} .hnf-goal-card-head b,.hnf-target-line>b,.hnf-client-goal-deadline>b{font-size:11px;border-radius:999px;padding:5px 8px;white-space:nowrap} .hnf-goal-progress-track,.hnf-target-progress{height:9px;border-radius:999px;background:#272730;overflow:hidden;margin:12px 0 8px} .hnf-goal-progress-track i,.hnf-target-progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7c3aed,#a855f7)} .hnf-goal-card-foot{display:flex;justify-content:space-between;gap:10px;color:#9d9da8;font-size:12px} .hnf-goal-reached{color:#8be2ad;background:rgba(40,140,80,.16)} .hnf-goal-ontrack{color:#a7e7bd;background:rgba(40,140,80,.12)} .hnf-goal-progressing{color:#c6b4ff;background:rgba(124,58,237,.16)} .hnf-goal-watch{color:#f1aaaa;background:rgba(175,55,55,.16)} .hnf-goal-wait{color:#c2c2cc;background:#292932} .hnf-client-goal-deadline{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#181820;border:1px solid #30303a;border-radius:11px;padding:12px;margin-bottom:12px} .hnf-client-goal-deadline>div{display:flex;flex-direction:column;gap:4px} .hnf-client-goal-deadline span{color:#9999a4;font-size:12px} .hnf-client-goal-deadline strong{font-size:17px} .hnf-client-goal-card{padding:13px} @media(max-width:900px){.hnf-goal-list{grid-template-columns:1fr}.hnf-goal-overview{grid-template-columns:1fr 1fr}} @media(max-width:620px){.hnf-goal-overview{grid-template-columns:1fr}.hnf-goal-card-foot{flex-direction:column}.hnf-client-goal-deadline{align-items:flex-start;flex-direction:column}} /* v3.6.0 Trainer Feedback & Client Messaging */ .hnf-trainer-feedback-panel{margin:24px 0;background:#15151c;border:1px solid #30303a;border-radius:12px;padding:14px;display:grid;gap:14px} .hnf-feedback-count,.hnf-unread-badge{background:rgba(124,58,237,.18);color:#c8b5ff;border:1px solid rgba(139,92,246,.35);border-radius:999px;padding:5px 9px;font-size:11px} .hnf-feedback-compose{display:grid;gap:10px}.hnf-feedback-compose textarea{width:100%;box-sizing:border-box} .hnf-feedback-actions{display:flex;justify-content:space-between;gap:10px}.hnf-feedback-actions select{flex:1} .hnf-feedback-history,.hnf-client-feedback-list{display:grid;gap:10px} .hnf-feedback-item,.hnf-client-feedback-message{background:#191921;border:1px solid #30303a;border-radius:11px;padding:12px} .hnf-feedback-item p,.hnf-client-feedback-message p{margin:8px 0 0;white-space:pre-wrap;color:#d7d7de} .hnf-feedback-meta,.hnf-client-feedback-head{display:flex;align-items:center;justify-content:space-between;gap:10px} .hnf-feedback-meta span,.hnf-client-feedback-head span{color:#94949f;font-size:12px} .hnf-feedback-meta b{font-size:10px;border-radius:999px;padding:4px 7px}.hnf-feedback-meta .is-read{color:#a7a7b0;background:#292932}.hnf-feedback-meta .is-unread{color:#c8b5ff;background:rgba(124,58,237,.18)} .hnf-client-feedback-message.is-unread{border-color:#7647d8;box-shadow:inset 3px 0 0 #8b5cf6} .hnf-client-feedback-head>div{display:flex;flex-direction:column;gap:3px}.hnf-client-feedback-head small{color:#9999a4}.hnf-mark-feedback-read{font-size:11px;padding:6px 9px} @media(max-width:620px){.hnf-feedback-actions,.hnf-feedback-meta,.hnf-client-feedback-head{align-items:flex-start;flex-direction:column}} /* v3.7.0 WhatsApp Integration */ .hnf-whatsapp-primary,.hnf-whatsapp-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none!important;border-radius:8px;font-weight:700} .hnf-whatsapp-primary{background:#25D366;color:#07160c!important;padding:9px 13px;border:1px solid #25D366} .hnf-whatsapp-primary:hover,.hnf-whatsapp-btn:hover{filter:brightness(1.06)} .hnf-whatsapp-btn{background:rgba(37,211,102,.13);border:1px solid rgba(37,211,102,.4);color:#72e99e!important;padding:7px 10px} .hnf-workspace-actions,.hnf-panel-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap} @media(max-width:620px){.hnf-workspace-actions,.hnf-panel-actions{align-items:stretch;flex-direction:column}.hnf-whatsapp-primary{width:100%;box-sizing:border-box}} /* v3.8.0 Contextual WhatsApp Coaching */ .hnf-context-wa-row{ display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 16px } .hnf-context-wa-row>span{font-size:12px;opacity:.72} .hnf-context-wa-workout{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)} .hnf-feedback-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap} @media(max-width:620px){ .hnf-context-wa-row,.hnf-feedback-head-actions{align-items:stretch;flex-direction:column} .hnf-context-wa-row .hnf-whatsapp-primary,.hnf-context-wa-row .hnf-whatsapp-btn{width:100%;box-sizing:border-box} } /* v3.9.0 Trainer Daily Dashboard */ .hnf-daily-dashboard{margin-bottom:26px} .hnf-dashboard-date{font-size:12px;opacity:.72} .hnf-daily-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 16px} .hnf-daily-stats>div{padding:14px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.025)} .hnf-daily-stats span{display:block;font-size:12px;opacity:.68;margin-bottom:4px} .hnf-daily-stats strong{font-size:24px} .hnf-daily-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} .hnf-daily-card{border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.02);padding:14px;min-width:0} .hnf-daily-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px} .hnf-daily-card-head h4{margin:0} .hnf-daily-card-head span{font-size:11px;opacity:.65} .hnf-daily-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.07)} .hnf-daily-item:first-child{border-top:0} .hnf-daily-item>div:first-child{min-width:0} .hnf-daily-item strong,.hnf-daily-item span{display:block} .hnf-daily-item span{font-size:11px;opacity:.7;margin-top:2px} .hnf-daily-actions{display:flex;gap:6px;flex-shrink:0} .hnf-clients-head{margin-top:4px} @media(max-width:900px){.hnf-daily-grid{grid-template-columns:1fr}.hnf-daily-stats{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:520px){.hnf-daily-stats{grid-template-columns:1fr 1fr}.hnf-daily-item{align-items:flex-start;flex-direction:column}.hnf-daily-actions{width:100%}} /* v5.2.0 embedded exercise videos */ .hnf-video-available{ display:inline-flex; align-items:center; border:1px solid rgba(139,92,246,.35); background:rgba(139,92,246,.12); border-radius:999px; padding:4px 8px; font-size:11px; font-weight:700; } .hnf-exercise-video{margin-top:14px} .hnf-exercise-video-frame{ position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:14px; background:#08080b; border:1px solid rgba(255,255,255,.08); } .hnf-exercise-video-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; } .hnf-exercise-video-actions{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:7px; font-size:11px; } .hnf-exercise-video-actions span{opacity:.62} .hnf-exercise-video-actions a{ text-decoration:none; font-weight:700; color:#b79cff; } .hnf-client-video-fallback{margin-top:12px} .hnf-client-video-fallback a{ display:inline-flex; padding:8px 10px; border-radius:9px; text-decoration:none; font-weight:700; } @media(max-width:600px){ .hnf-exercise-video-frame{border-radius:11px} } /* v5.2.1 quick workout assignment */ .hnf-quick-assign-panel{margin:16px 0;border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:14px;background:rgba(255,255,255,.02)} .hnf-quick-assign-form{display:grid;grid-template-columns:1.25fr .8fr 1.5fr auto;gap:8px;align-items:end} .hnf-quick-assignment-list{margin-top:12px} .hnf-quick-assignment-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.07)} .hnf-quick-assignment-row:first-child{border-top:0} .hnf-quick-assignment-row strong,.hnf-quick-assignment-row span{display:block} .hnf-quick-assignment-row>div:first-child>span{font-size:11px;opacity:.68;margin-top:2px} .hnf-quick-status{font-size:10px!important;text-transform:uppercase;opacity:.6} .hnf-quick-client-card{border-color:rgba(139,92,246,.28)!important} @media(max-width:760px){.hnf-quick-assign-form{grid-template-columns:1fr}.hnf-quick-assignment-row{align-items:flex-start;flex-direction:column}} /* v5.3.0 push notification foundation */ .hnf-push-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .hnf-push-actions .secondary{white-space:nowrap} @media(max-width:600px){.hnf-push-actions{width:100%;justify-content:flex-end}} /* v5.3.1 notification status + test */ .hnf-push-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:800;white-space:nowrap} .hnf-push-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor} .hnf-push-status.is-on{color:#4ade80;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.35)} .hnf-push-status.is-off{color:#f87171;background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.28)} /* v5.3.3 notification diagnostics */ #hnf-trainer-push-diagnostics,#hnf-client-push-diagnostics{font-size:11px} /* v5.5.0 notification preferences */ #hnf-trainer-push-prefs,#hnf-client-push-prefs{font-size:11px} /* v5.5.2 notification preferences mobile polish */ .hnf-client-notification-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:5px} .hnf-reminder-summary{font-size:10px;opacity:.62;text-align:right} .hnf-push-prefs-message{min-height:18px;margin-top:10px;font-size:12px;color:#8ee6a8} .hnf-push-prefs-actions{gap:8px} #hnf-push-prefs-cancel{background:#25252d;color:#fff} .hnf-push-pref-grid.is-disabled{opacity:.42} .hnf-push-pref-grid label>span{display:block} @media(max-width:600px){ #hnf-push-prefs-modal{padding:10px;align-items:end} .hnf-push-prefs-card{width:100%;max-height:88vh;border-radius:18px 18px 8px 8px;padding:15px 14px calc(14px + env(safe-area-inset-bottom))} .hnf-push-prefs-head{position:sticky;top:-15px;background:#121218;padding:12px 0 10px;z-index:2} .hnf-push-pref-row{padding:13px 0;align-items:center} .hnf-push-pref-row b{font-size:14px} .hnf-push-pref-row span{font-size:11px;line-height:1.35} .hnf-push-pref-row input[type=checkbox]{width:24px;height:24px;flex:0 0 auto} .hnf-push-pref-grid{grid-template-columns:1fr;gap:10px;padding:10px 0 2px} .hnf-push-pref-grid select{min-height:44px;font-size:16px} .hnf-push-prefs-actions{position:sticky;bottom:calc(-15px - env(safe-area-inset-bottom));background:#121218;padding:12px 0 calc(10px + env(safe-area-inset-bottom));z-index:2} .hnf-push-prefs-actions button{min-height:44px} .hnf-client-notification-wrap{align-items:flex-end;width:100%} .hnf-reminder-summary{text-align:right} } /* v5.6.0 smart reminders + notification history */ #hnf-notification-history-modal{position:fixed;inset:0;z-index:100012;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:18px} #hnf-notification-history-modal[hidden]{display:none!important} .hnf-notification-history-card{width:min(620px,100%);max-height:min(760px,90vh);overflow:auto;background:#121218;color:#fff;border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:16px;box-shadow:0 24px 80px rgba(0,0,0,.45)} .hnf-notification-history-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid rgba(255,255,255,.07)} .hnf-notification-history-row:first-child{border-top:0} .hnf-notification-history-row strong,.hnf-notification-history-row span,.hnf-notification-history-row small{display:block} .hnf-notification-history-row>div>span{font-size:12px;opacity:.75;margin-top:3px} .hnf-notification-history-row small{font-size:10px;opacity:.5;margin-top:5px} .hnf-notification-status{font-size:10px;font-weight:800;border-radius:999px;padding:5px 8px;white-space:nowrap} .hnf-notification-status.is-sent{color:#4ade80;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3)} .hnf-notification-status.is-failed{color:#f87171;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.25)} #hnf-trainer-notification-history,#hnf-client-notification-history{font-size:11px} @media(max-width:600px){ #hnf-notification-history-modal{padding:10px;align-items:end} .hnf-notification-history-card{max-height:88vh;border-radius:18px 18px 8px 8px;padding:14px 14px calc(14px + env(safe-area-inset-bottom))} } /* v5.6.1 history test fix */ .hnf-history-head-actions{display:flex;align-items:center;gap:6px} #hnf-notification-history-refresh{border:0;border-radius:8px;background:#25252d;color:#fff;padding:7px 9px;font-size:11px;font-weight:700;cursor:pointer} /* v5.7.0 notification center */ .hnf-history-summary{display:block;font-size:10px;opacity:.58;margin-top:2px} .hnf-notification-count{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:999px;margin-left:5px;padding:0 5px;background:#ef4444;color:#fff;font-size:10px;font-weight:900} .hnf-notification-history-row{width:100%;text-align:left;background:transparent;color:inherit;border:0;border-top:1px solid rgba(255,255,255,.07);cursor:pointer} .hnf-notification-history-row:hover{background:rgba(255,255,255,.025)} .hnf-notification-history-row.is-unread{background:rgba(139,92,246,.06)} .hnf-notification-history-row.is-read{opacity:.74} .hnf-unread-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#8b5cf6;margin-left:6px;vertical-align:middle} #hnf-notification-history-read-all{border:0;border-radius:8px;background:#8b5cf6;color:#fff;padding:7px 9px;font-size:11px;font-weight:700;cursor:pointer} @media(max-width:600px){ .hnf-history-head-actions{flex-wrap:wrap;justify-content:flex-end} #hnf-notification-history-read-all,#hnf-notification-history-refresh{min-height:36px} } /* v5.8.0 mobile-first client home */ .hnf-client-mobile-home{display:none} .hnf-client-bottom-nav{display:none} @media(max-width:700px){ .hnf-client-app{margin:0 auto;padding:0;max-width:none} .hnf-client-card{border-radius:0;border-left:0;border-right:0;padding:18px 16px 92px;min-height:100vh;box-shadow:none} #hnf-client-dashboard>.hnf-trainer-head{gap:10px} #hnf-client-dashboard>.hnf-trainer-head h2{font-size:24px;margin-bottom:2px} .hnf-client-notification-wrap .hnf-push-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%} .hnf-client-notification-wrap .hnf-push-actions button,.hnf-client-notification-wrap .hnf-push-actions .hnf-push-status{min-height:40px;font-size:10px;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px} .hnf-reminder-summary{font-size:10px;text-align:left!important;margin-top:5px} .hnf-client-mobile-home{display:block;margin:18px 0 12px} .hnf-mobile-home-eyebrow{font-size:11px;letter-spacing:.16em;font-weight:900;color:#a78bfa;margin-bottom:8px} .hnf-mobile-today-card{background:linear-gradient(135deg,#21183a,#15151d);border:1px solid rgba(139,92,246,.45);border-radius:18px;padding:18px;display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 14px 35px rgba(0,0,0,.22)} .hnf-mobile-kicker{display:block;color:#b9a4ff;font-size:11px;font-weight:800;margin-bottom:5px} .hnf-mobile-today-card h3{font-size:21px;margin:0 0 4px} .hnf-mobile-today-card p{font-size:12px;margin:0} .hnf-mobile-start{white-space:nowrap;padding:11px 13px!important} .hnf-mobile-home-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px} .hnf-mobile-summary-card{background:#15151b;border:1px solid #292933;border-radius:14px;padding:14px;min-width:0} .hnf-mobile-summary-card span,.hnf-mobile-summary-card small{display:block;color:#9999a5;font-size:10px} .hnf-mobile-summary-card strong{display:block;font-size:19px;margin:5px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .hnf-client-grid-4{display:none} .hnf-client-nav{display:none} #hnf-client-view-programs{margin-top:12px} #hnf-client-view-programs>.hnf-panel-head{display:none} .hnf-client-program-card{margin:10px 0} .hnf-client-bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:10000;background:rgba(15,15,20,.96);backdrop-filter:blur(16px);border-top:1px solid #2d2d38;padding:7px 8px calc(7px + env(safe-area-inset-bottom));box-shadow:0 -12px 30px rgba(0,0,0,.32)} .hnf-client-card .hnf-client-bottom-btn{background:transparent!important;color:#8f8f9b!important;border:0!important;border-radius:12px!important;padding:6px 4px!important;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:48px} .hnf-client-bottom-btn span{font-size:17px;line-height:18px}.hnf-client-bottom-btn b{font-size:10px} .hnf-client-card .hnf-client-bottom-btn.active{color:#fff!important;background:rgba(139,92,246,.16)!important} } @media(max-width:520px) and (orientation:portrait){ .hnf-mobile-today-card{align-items:flex-start;flex-direction:column}.hnf-mobile-start{width:100%} } /* v5.8.1 portrait-phone activation fallback */ html.hnf-client-phone-portrait .hnf-client-app{margin:0 auto;padding:0;max-width:none} html.hnf-client-phone-portrait .hnf-client-card{border-radius:0;border-left:0;border-right:0;padding:18px 16px 92px;min-height:100vh;box-shadow:none} html.hnf-client-phone-portrait .hnf-client-mobile-home{display:block;margin:18px 0 12px} html.hnf-client-phone-portrait .hnf-client-grid-4, html.hnf-client-phone-portrait .hnf-client-nav{display:none} html.hnf-client-phone-portrait .hnf-client-bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:10000;background:rgba(15,15,20,.96);backdrop-filter:blur(16px);border-top:1px solid #2d2d38;padding:7px 8px calc(7px + env(safe-area-inset-bottom));box-shadow:0 -12px 30px rgba(0,0,0,.32)} html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%} html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions button, html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions .hnf-push-status{min-height:40px;font-size:10px;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px} html.hnf-client-phone-portrait #hnf-client-view-programs{margin-top:12px} html.hnf-client-phone-portrait #hnf-client-view-programs>.hnf-panel-head{display:none} /* v5.8.2 mobile device detection hard fallback */ html.hnf-client-phone-portrait body{overflow-x:hidden} html.hnf-client-phone-portrait .hnf-client-app{width:100%!important;max-width:none!important;margin:0!important;padding:0!important} html.hnf-client-phone-portrait .hnf-client-card{width:100%!important;max-width:none!important;margin:0!important;border-radius:0!important;border-left:0!important;border-right:0!important;padding:18px 16px 92px!important;min-height:100dvh!important;box-shadow:none!important} html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head{display:block!important} html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head>div:first-child{margin-bottom:12px} html.hnf-client-phone-portrait .hnf-client-notification-wrap{align-items:stretch!important;width:100%!important} html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;width:100%!important} html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions>*{width:100%!important;min-width:0!important} html.hnf-client-phone-portrait .hnf-reminder-summary{text-align:left!important} html.hnf-client-phone-portrait .hnf-client-mobile-home{display:block!important} html.hnf-client-phone-portrait .hnf-client-grid-4{display:none!important} html.hnf-client-phone-portrait .hnf-client-nav{display:none!important} html.hnf-client-phone-portrait .hnf-client-bottom-nav{display:grid!important} html.hnf-client-phone-portrait #hnf-client-view-programs{display:block!important;margin-top:12px!important} html.hnf-client-phone-portrait #hnf-client-view-programs>.hnf-panel-head{display:none!important} html.hnf-client-phone-portrait .hnf-client-program-card{margin:10px 0!important} html.hnf-client-phone-portrait .hnf-mobile-home-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important} html.hnf-client-phone-portrait .hnf-mobile-today-card{display:flex!important} @media (orientation:landscape){ html.hnf-client-phone-portrait .hnf-client-bottom-nav{display:none!important} } /* v5.8.3 mobile content + true viewport nav fix */ html.hnf-client-phone-portrait, html.hnf-client-phone-portrait body{ min-height:100%; overflow-x:hidden!important; } html.hnf-client-phone-portrait body{ padding-bottom:calc(68px + env(safe-area-inset-bottom))!important; } html.hnf-client-phone-portrait #hnf-client-app-root{ display:block!important; position:relative!important; width:100%!important; max-width:none!important; min-height:100dvh!important; margin:0!important; padding:0!important; transform:none!important; filter:none!important; perspective:none!important; } html.hnf-client-phone-portrait #hnf-client-dashboard{ display:block!important; visibility:visible!important; opacity:1!important; position:relative!important; width:100%!important; min-height:calc(100dvh - 68px)!important; } html.hnf-client-phone-portrait #hnf-client-dashboard[hidden]{ display:block!important; } html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head, html.hnf-client-phone-portrait #hnf-client-mobile-home, html.hnf-client-phone-portrait #hnf-client-view-programs{ visibility:visible!important; opacity:1!important; } html.hnf-client-phone-portrait #hnf-client-mobile-home{ display:block!important; } html.hnf-client-phone-portrait #hnf-client-view-programs{ display:block!important; } body > #hnf-client-bottom-nav{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; position:fixed!important; left:0!important; right:0!important; bottom:0!important; top:auto!important; width:100vw!important; margin:0!important; z-index:2147483000!important; background:rgba(15,15,20,.98)!important; border-top:1px solid #2d2d38!important; padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important; box-shadow:0 -10px 28px rgba(0,0,0,.4)!important; transform:none!important; } body > #hnf-client-bottom-nav .hnf-client-bottom-btn{ background:transparent!important; color:#aaaab5!important; border:0!important; border-radius:12px!important; padding:6px 4px!important; min-width:0!important; min-height:48px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:2px!important; } body > #hnf-client-bottom-nav .hnf-client-bottom-btn.active{ color:#fff!important; background:rgba(139,92,246,.18)!important; } @media (orientation:landscape){ body > #hnf-client-bottom-nav{display:none!important} } /* v5.8.4 mobile client UI polish */ html.hnf-client-phone-portrait .hnf-client-card{ padding:18px 14px 96px!important; background:#101015!important; } html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head{ padding:2px 0 10px!important; } html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head h2{ font-size:22px!important; line-height:1.08!important; margin:4px 0 3px!important; } html.hnf-client-phone-portrait #hnf-client-dashboard>.hnf-trainer-head p{ margin:0!important; } html.hnf-client-phone-portrait .hnf-client-notification-wrap{ margin-top:12px!important; } html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions button, html.hnf-client-phone-portrait .hnf-client-notification-wrap .hnf-push-actions .hnf-push-status{ min-height:38px!important; border-radius:11px!important; font-size:9.5px!important; padding:7px!important; } html.hnf-client-phone-portrait .hnf-reminder-summary{ margin-top:7px!important; padding-left:2px!important; font-size:9.5px!important; opacity:.55!important; } html.hnf-client-phone-portrait .hnf-client-mobile-home{ margin:20px 0 14px!important; } .hnf-mobile-section-title{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin:0 2px 10px; } .hnf-mobile-section-title h3{ margin:2px 0 0; font-size:20px; } .hnf-mobile-home-eyebrow{ display:block; font-size:10px!important; letter-spacing:.18em!important; color:#a78bfa!important; } .hnf-mobile-date{ font-size:11px; color:#8e8e99; padding-bottom:2px; } html.hnf-client-phone-portrait .hnf-mobile-today-card{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:14px!important; background: radial-gradient(circle at top right,rgba(139,92,246,.28),transparent 34%), linear-gradient(145deg,#1b1727,#15151c)!important; border:1px solid rgba(139,92,246,.33)!important; border-radius:18px!important; padding:17px!important; min-height:126px; box-shadow:0 12px 30px rgba(0,0,0,.24)!important; } .hnf-mobile-today-copy{ min-width:0; flex:1; } .hnf-mobile-kicker{ font-size:10px!important; letter-spacing:.04em; color:#b7a4ff!important; } html.hnf-client-phone-portrait .hnf-mobile-today-card h3{ margin:4px 0 5px!important; font-size:24px!important; line-height:1.08!important; } html.hnf-client-phone-portrait .hnf-mobile-today-card p{ margin:0!important; font-size:11px!important; color:#aaaab4!important; } html.hnf-client-phone-portrait .hnf-mobile-start{ flex:0 0 auto!important; min-width:118px!important; min-height:54px!important; border-radius:14px!important; padding:11px 13px!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:7px!important; font-size:11px!important; font-weight:800!important; } html.hnf-client-phone-portrait .hnf-mobile-home-grid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; margin-top:10px!important; } html.hnf-client-phone-portrait .hnf-mobile-summary-card{ appearance:none; text-align:left; width:100%; min-width:0; background:#15151c!important; border:1px solid #2b2b35!important; border-radius:15px!important; padding:14px!important; color:#fff!important; min-height:118px; cursor:pointer; } .hnf-mobile-summary-icon{ display:grid!important; place-items:center; width:28px; height:28px; border-radius:9px; background:rgba(139,92,246,.15); color:#b9a3ff!important; font-size:13px!important; margin-bottom:11px; } .hnf-mobile-summary-label{ display:block!important; color:#8f8f9a!important; font-size:10px!important; margin-bottom:3px!important; } html.hnf-client-phone-portrait .hnf-mobile-summary-card strong{ display:block!important; margin:0 0 3px!important; font-size:21px!important; line-height:1.05!important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } html.hnf-client-phone-portrait .hnf-mobile-summary-card small{ display:block!important; margin:0!important; color:#8f8f9a!important; font-size:9.5px!important; line-height:1.25!important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .hnf-mobile-quick-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; } .hnf-mobile-quick-actions button{ min-height:46px; border-radius:13px!important; background:#191920!important; border:1px solid #2b2b35!important; color:#ddd!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:7px!important; font-size:10px!important; } .hnf-mobile-quick-actions button span{ color:#a78bfa; } html.hnf-client-phone-portrait #hnf-client-view-programs{ margin-top:14px!important; } html.hnf-client-phone-portrait #hnf-client-view-programs>.hnf-list:empty{ display:none!important; } html.hnf-client-phone-portrait #hnf-client-programs>.hnf-empty{ margin-top:4px!important; } body > #hnf-client-bottom-nav{ min-height:64px!important; } body > #hnf-client-bottom-nav .hnf-client-bottom-btn{ min-height:50px!important; } body > #hnf-client-bottom-nav .hnf-client-bottom-btn span{ font-size:15px!important; line-height:1!important; } body > #hnf-client-bottom-nav .hnf-client-bottom-btn b{ font-size:9.5px!important; } @media(max-width:420px) and (orientation:portrait){ html.hnf-client-phone-portrait .hnf-mobile-today-card{ align-items:flex-start!important; flex-direction:column!important; } html.hnf-client-phone-portrait .hnf-mobile-start{ width:100%!important; } html.hnf-client-phone-portrait .hnf-mobile-home-grid{ grid-template-columns:1fr!important; } .hnf-mobile-quick-actions{ grid-template-columns:1fr!important; } } /* v5.8.5 mobile home dashboard */ .hnf-mobile-week-card{ margin-top:12px; background:#131319; border:1px solid #292933; border-radius:17px; padding:15px; } .hnf-mobile-week-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:12px; } .hnf-mobile-week-head h3{ margin:2px 0 0; font-size:18px; } .hnf-mobile-week-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; } .hnf-mobile-week-stat{ background:#181820; border:1px solid #292934; border-radius:13px; padding:12px 10px; min-width:0; } .hnf-mobile-week-stat span, .hnf-mobile-week-stat small{ display:block; color:#8f8f9a; font-size:9px; } .hnf-mobile-week-stat strong{ display:block; margin:4px 0 2px; font-size:20px; line-height:1; } .hnf-mobile-next-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; background:#17171e; border:1px solid #292934; border-radius:13px; padding:12px; } .hnf-mobile-next-row>div{ min-width:0; } .hnf-mobile-next-row span, .hnf-mobile-next-row small{ display:block; color:#8f8f9a; font-size:9.5px; } .hnf-mobile-next-row strong{ display:block; font-size:14px; margin:3px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .hnf-mobile-next-row button{ flex:0 0 auto; border-radius:10px!important; padding:9px 11px!important; min-height:38px!important; font-size:9.5px!important; } html.hnf-client-phone-portrait #hnf-client-view-programs{ margin-top:12px!important; } html.hnf-client-phone-portrait #hnf-client-programs>.hnf-empty{ padding:12px!important; min-height:auto!important; } @media(max-width:520px) and (orientation:portrait){ .hnf-mobile-week-grid{grid-template-columns:1fr 1fr} .hnf-mobile-next-row{align-items:flex-start;flex-direction:column} .hnf-mobile-next-row button{width:100%} } /* v5.8.6 duplicate quick-workout prevention + final mobile polish */ .hnf-quick-client-head{ align-items:center!important; } .hnf-quick-count{ flex:0 0 auto; font-size:9px!important; line-height:1!important; padding:6px 8px; border-radius:999px; background:rgba(139,92,246,.12); border:1px solid rgba(139,92,246,.24); color:#b8a3ff!important; } html.hnf-client-phone-portrait .hnf-quick-client-card{ margin-top:12px!important; border-radius:16px!important; } html.hnf-client-phone-portrait .hnf-quick-client-card .hnf-workout-title{ padding-bottom:10px!important; } html.hnf-client-phone-portrait .hnf-quick-client-card .hnf-workout-item{ min-height:58px!important; padding:11px 12px!important; } html.hnf-client-phone-portrait .hnf-quick-client-card .hnf-workout-item-main strong{ font-size:12px!important; } html.hnf-client-phone-portrait .hnf-quick-client-card .hnf-workout-item-main span{ font-size:9.5px!important; } html.hnf-client-phone-portrait .hnf-mobile-week-card{ margin-bottom:12px!important; } html.hnf-client-phone-portrait #hnf-client-view-programs{ padding-bottom:8px!important; } @media(max-width:520px) and (orientation:portrait){ .hnf-quick-client-head{ align-items:flex-start!important; gap:8px!important; } } /* v5.8.7 mobile workouts tab */ .hnf-mobile-workouts-overview{display:none} html.hnf-client-phone-portrait .hnf-mobile-workouts-overview{ display:block!important; margin-top:4px; } html.hnf-client-phone-portrait .hnf-desktop-workout-head, html.hnf-client-phone-portrait #hnf-client-workouts{ display:none!important; } .hnf-mobile-workouts-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:12px; } .hnf-mobile-workouts-head h3{ margin:2px 0 0; font-size:22px; } .hnf-mobile-workout-summary{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:14px; } .hnf-mobile-workout-summary>div{ background:#17171e; border:1px solid #2a2a34; border-radius:13px; padding:12px; } .hnf-mobile-workout-summary span{ display:block; color:#8f8f99; font-size:9px; } .hnf-mobile-workout-summary strong{ display:block; margin-top:4px; font-size:20px; } .hnf-mobile-workout-section{ margin-top:14px; } .hnf-mobile-workout-section-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; } .hnf-mobile-workout-section-head h4{ margin:0; font-size:14px; } .hnf-mobile-workout-section-head span{ display:grid; place-items:center; min-width:22px; height:22px; border-radius:999px; background:rgba(139,92,246,.14); color:#b9a4ff; font-size:9px; font-weight:800; } .hnf-mobile-workout-stack{ display:grid; gap:8px; } .hnf-mobile-workout-card{ display:flex; align-items:center; justify-content:space-between; gap:12px; background:#15151c; border:1px solid #2a2a35; border-radius:15px; padding:14px; } .hnf-mobile-workout-card.is-completed{ opacity:.78; } .hnf-mobile-workout-card-main{ min-width:0; } .hnf-mobile-workout-status{ display:inline-flex; align-items:center; min-height:20px; padding:3px 7px; margin-bottom:7px; border-radius:999px; background:rgba(139,92,246,.12); border:1px solid rgba(139,92,246,.22); color:#b9a4ff; font-size:8px; font-weight:900; letter-spacing:.08em; } .hnf-mobile-workout-card.is-completed .hnf-mobile-workout-status{ color:#52db86; background:rgba(34,197,94,.10); border-color:rgba(34,197,94,.22); } .hnf-mobile-workout-card h4{ margin:0 0 4px; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .hnf-mobile-workout-card p{ margin:0; color:#8f8f9a; font-size:9.5px; } .hnf-mobile-open-workout{ flex:0 0 auto; min-height:40px!important; padding:8px 11px!important; border-radius:11px!important; font-size:9.5px!important; } .hnf-mobile-workout-empty{ padding:16px 12px; border:1px dashed #2d2d37; border-radius:13px; color:#7f7f89; font-size:10px; text-align:center; } @media(max-width:430px) and (orientation:portrait){ .hnf-mobile-workout-card{ align-items:flex-start; flex-direction:column; } .hnf-mobile-open-workout{ width:100%; } } /* v5.8.8.1 true mobile app screens - fixed */ .hnf-mobile-subscreen-head{display:none} html.hnf-client-phone-portrait .hnf-client-home-shell[hidden]{display:none!important} html.hnf-client-phone-portrait .hnf-client-home-shell{display:block} html.hnf-client-phone-portrait .hnf-client-grid-4, html.hnf-client-phone-portrait .hnf-client-nav{display:none!important} html.hnf-client-phone-portrait .hnf-client-view[hidden]{display:none!important} html.hnf-client-phone-portrait .hnf-mobile-subscreen-head{ display:flex!important; align-items:center; justify-content:space-between; gap:12px; margin:0 0 16px; padding:4px 0 8px; } html.hnf-client-phone-portrait .hnf-mobile-subscreen-head h2{ margin:2px 0 0; font-size:24px; line-height:1.05; } html.hnf-client-phone-portrait .hnf-mobile-subscreen-head button{ flex:0 0 auto; min-height:38px!important; padding:8px 12px!important; border-radius:11px!important; background:#1c1c24!important; border:1px solid #31313c!important; color:#ddd!important; font-size:10px!important; } html.hnf-client-phone-portrait #hnf-client-view-workouts, html.hnf-client-phone-portrait #hnf-client-view-progress{ margin-top:0!important; padding:4px 0 18px!important; } html.hnf-client-phone-portrait #hnf-client-view-workouts .hnf-mobile-workouts-overview{ margin-top:0!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-columns{ margin-top:0!important; } /* v5.8.8.2 Home-content visibility fix */ html.hnf-client-phone-portrait #hnf-client-view-programs[hidden], html.hnf-client-phone-portrait #hnf-client-view-workouts[hidden], html.hnf-client-phone-portrait #hnf-client-view-progress[hidden]{ display:none!important; } html.hnf-client-phone-portrait #hnf-client-view-programs:not([hidden]){ display:block!important; } html.hnf-client-phone-portrait #hnf-client-home-shell[hidden]{ display:none!important; } html.hnf-client-phone-portrait #hnf-client-home-shell:not([hidden]){ display:block!important; } /* v5.8.9 polished mobile Progress screen */ .hnf-mobile-progress-dashboard{display:none} html.hnf-client-phone-portrait .hnf-mobile-progress-dashboard{ display:block!important; margin-bottom:12px; } .hnf-mobile-progress-hero{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; padding:17px; border-radius:17px; border:1px solid rgba(139,92,246,.30); background: radial-gradient(circle at top right,rgba(139,92,246,.25),transparent 36%), linear-gradient(145deg,#1b1727,#15151c); } .hnf-mobile-progress-hero>div:first-child{ min-width:0; } .hnf-mobile-progress-hero strong{ display:block; font-size:28px; line-height:1; margin:6px 0 5px; } .hnf-mobile-progress-hero small{ display:block; color:#9a9aa5; font-size:9.5px; } .hnf-mobile-progress-hero-delta{ max-width:42%; text-align:right; color:#b7a4ff; font-size:10px; line-height:1.35; } .hnf-mobile-progress-metrics{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:9px; } .hnf-mobile-progress-metrics>div{ min-width:0; padding:12px; background:#17171e; border:1px solid #2a2a34; border-radius:13px; } .hnf-mobile-progress-metrics span, .hnf-mobile-progress-metrics small{ display:block; color:#8f8f99; font-size:9px; } .hnf-mobile-progress-metrics strong{ display:block; margin:4px 0 3px; font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .hnf-mobile-progress-actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:9px; } .hnf-mobile-progress-actions button{ min-height:44px!important; border-radius:12px!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:7px!important; background:#1a1a22!important; border:1px solid #2d2d38!important; color:#e6e6eb!important; font-size:10px!important; } .hnf-mobile-progress-actions button span{ color:#a78bfa; font-size:14px; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-columns{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:9px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card{ margin:0 0 10px!important; padding:14px!important; border-radius:15px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress #hnf-mobile-checkin-form-card, html.hnf-client-phone-portrait #hnf-client-view-progress #hnf-mobile-photo-form-card{ min-height:100%; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card h3{ font-size:14px!important; margin:0 0 9px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-form-grid{ grid-template-columns:1fr 1fr!important; gap:6px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card input, html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card select, html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card textarea{ margin:3px 0!important; padding:10px!important; min-height:40px!important; font-size:10px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card textarea{ min-height:72px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card button{ min-height:40px!important; border-radius:10px!important; font-size:10px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-summary{ grid-template-columns:1fr 1fr!important; gap:8px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-trend-grid{ grid-template-columns:1fr 1fr!important; gap:8px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-mini-chart{ min-height:120px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-photo-grid{ grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:8px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-photo-card figcaption{ padding:7px!important; font-size:9px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-measurement-scroll{ margin:0 -2px; } @media(max-width:520px) and (orientation:portrait){ .hnf-mobile-progress-metrics{grid-template-columns:1fr 1fr} .hnf-mobile-progress-metrics>div:last-child{grid-column:1/-1} html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-columns{ grid-template-columns:1fr!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-form-grid{ grid-template-columns:1fr 1fr!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-trend-grid{ grid-template-columns:1fr!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-photo-grid{ grid-template-columns:1fr 1fr!important; } } /* v5.9.0 mobile Progress UI polish */ html.hnf-client-phone-portrait #hnf-client-view-progress{ padding-bottom:28px!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-mobile-subscreen-head{ margin-bottom:12px!important; } html.hnf-client-phone-portrait .hnf-mobile-progress-hero{ position:relative; overflow:hidden; min-height:122px; padding:18px!important; box-shadow:0 14px 36px rgba(0,0,0,.28); } html.hnf-client-phone-portrait .hnf-mobile-progress-hero:after{ content:""; position:absolute; width:120px; height:120px; right:-34px; top:-46px; border-radius:50%; background:rgba(139,92,246,.10); pointer-events:none; } html.hnf-client-phone-portrait .hnf-mobile-progress-hero strong{ font-size:32px!important; letter-spacing:-.02em; } html.hnf-client-phone-portrait .hnf-mobile-progress-hero-delta{ position:relative; z-index:1; padding:7px 10px; border-radius:999px; background:rgba(139,92,246,.12); border:1px solid rgba(139,92,246,.22); max-width:none!important; white-space:nowrap; } html.hnf-client-phone-portrait .hnf-mobile-progress-metrics>div{ min-height:92px; display:flex; flex-direction:column; justify-content:center; padding:13px!important; } html.hnf-client-phone-portrait .hnf-mobile-progress-metrics strong{ font-size:20px!important; } html.hnf-client-phone-portrait .hnf-mobile-progress-actions button{ min-height:46px!important; font-weight:800!important; } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-progress-card{ background:#14141b!important; border-color:#292933!important; box-shadow:0 8px 22px rgba(0,0,0,.12); } html.hnf-client-phone-portrait #hnf-client-view-progress .hnf-panel-head{ align-items:flex-start!important; gap:10px!important; margin-bottom:10px!important; } .hnf-mobile-section-copy{ display:none; } html.hnf-client-phone-portrait .hnf-mobile-section-copy{ display:block!important; margin:3px 0 0!important; color:#888894!important; font-size:9.5px!important; line-height:1.35!important; } html.hnf-client-phone-portrait #hnf-client-feedback-card .hnf-panel-actions{ align-self:center; } html.hnf-client-phone-portrait #hnf-client-feedback-card .hnf-whatsapp-primary{ min-height:36px!important; padding:8px 10px!important; border-radius:10px!important; font-size:9px!important; } html.hnf-client-phone-portrait .hnf-client-feedback-message{ border-radius:12px!important; padding:12px!important; } html.hnf-client-phone-portrait .hnf-client-feedback-message p{ font-size:10px!important; line-height:1.45!important; } html.hnf-client-phone-portrait #hnf-client-targets{ display:grid; gap:8px; } html.hnf-client-phone-portrait .hnf-client-goal-card{ border-radius:12px!important; background:#181820!important; border:1px solid #2a2a34!important; padding:12px!important; } html.hnf-client-phone-portrait .hnf-target-line{ gap:8px!important; } html.hnf-client-phone-portrait .hnf-target-line strong{ font-size:12px!important; } html.hnf-client-phone-portrait .hnf-target-line b{ font-size:8px!important; padding:5px 7px!important; } html.hnf-client-phone-portrait .hnf-target-progress{ height:7px!important; margin:9px 0 6px!important; border-radius:999px!important; } html.hnf-client-phone-portrait .hnf-goal-card-foot{ font-size:8.5px!important; } html.hnf-client-phone-portrait .hnf-client-goal-deadline{ border-radius:12px!important; padding:12px!important; background:#181820!important; border:1px solid #2a2a34!important; } html.hnf-client-phone-portrait .hnf-progress-summary>div{ border-radius:12px!important; padding:12px!important; min-height:78px; justify-content:center; } html.hnf-client-phone-portrait .hnf-progress-summary span, html.hnf-client-phone-portrait .hnf-progress-summary small{ font-size:8.5px!important; } html.hnf-client-phone-portrait .hnf-progress-summary strong{ font-size:16px!important; } html.hnf-client-phone-portrait .hnf-trend-grid>div{ background:#17171e; border:1px solid #292933; border-radius:12px; padding:10px; } html.hnf-client-phone-portrait .hnf-trend-grid h4{ margin:0 0 8px!important; font-size:10px!important; } html.hnf-client-phone-portrait .hnf-mini-chart{ background:transparent!important; border:0!important; padding:0!important; min-height:128px!important; } html.hnf-client-phone-portrait .hnf-chart-line{ stroke-width:2.4!important; } html.hnf-client-phone-portrait .hnf-chart-label{ font-size:9px!important; } html.hnf-client-phone-portrait .hnf-mobile-history-card .hnf-measurement-scroll{ overflow-x:auto!important; border:1px solid #292933; border-radius:12px; background:#15151c; } html.hnf-client-phone-portrait .hnf-mobile-history-card .hnf-measurement-table-wide{ min-width:760px!important; } html.hnf-client-phone-portrait .hnf-mobile-history-card .hnf-measurement-row{ grid-template-columns:1.15fr repeat(8,.9fr)!important; padding:9px 10px!important; gap:7px!important; font-size:9px!important; border-radius:0!important; border-bottom:1px solid rgba(255,255,255,.04); } html.hnf-client-phone-portrait .hnf-mobile-history-card .hnf-measurement-row:last-child{ border-bottom:0; } html.hnf-client-phone-portrait .hnf-mobile-history-card .hnf-measurement-head{ position:sticky; top:0; z-index:2; display:grid!important; background:#1d1b28!important; color:#b9a4ff!important; } html.hnf-client-phone-portrait .hnf-mobile-photos-card .hnf-photo-grid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:9px!important; } html.hnf-client-phone-portrait .hnf-mobile-photos-card .hnf-photo-card{ border-radius:13px!important; overflow:hidden; background:#15151c!important; border-color:#2a2a34!important; } html.hnf-client-phone-portrait .hnf-mobile-photos-card .hnf-photo-card img{ aspect-ratio:4/5!important; object-fit:cover!important; } html.hnf-client-phone-portrait .hnf-mobile-photos-card .hnf-photo-card figcaption{ padding:8px!important; font-size:8.5px!important; color:#92929d!important; } html.hnf-client-phone-portrait #hnf-mobile-checkin-form-card, html.hnf-client-phone-portrait #hnf-mobile-photo-form-card{ background:#16161e!important; } html.hnf-client-phone-portrait #hnf-mobile-checkin-form-card input, html.hnf-client-phone-portrait #hnf-mobile-photo-form-card input, html.hnf-client-phone-portrait #hnf-mobile-photo-form-card select, html.hnf-client-phone-portrait #hnf-mobile-checkin-form-card textarea{ background:#111117!important; border-color:#2c2c36!important; } html.hnf-client-phone-portrait #hnf-progress-save, html.hnf-client-phone-portrait #hnf-photo-save{ width:100%!important; min-height:42px!important; } @media(max-width:520px) and (orientation:portrait){ html.hnf-client-phone-portrait .hnf-mobile-progress-hero{ align-items:flex-start!important; flex-direction:column!important; } html.hnf-client-phone-portrait .hnf-mobile-progress-hero-delta{ align-self:flex-start; } html.hnf-client-phone-portrait .hnf-mobile-photos-card .hnf-photo-grid{ grid-template-columns:1fr 1fr!important; } } /* v5.9.1 mobile Alerts screen */ html.hnf-client-phone-portrait #hnf-client-view-alerts{ margin-top:0!important; padding:4px 0 24px!important; } .hnf-mobile-alerts-hero{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:17px; border-radius:17px; border:1px solid rgba(139,92,246,.30); background: radial-gradient(circle at top right,rgba(139,92,246,.25),transparent 38%), linear-gradient(145deg,#1b1727,#15151c); box-shadow:0 14px 36px rgba(0,0,0,.24); } .hnf-mobile-alerts-hero strong{ display:block; margin:6px 0 4px; font-size:24px; } .hnf-mobile-alerts-hero small{ display:block; color:#92929d; font-size:9.5px; } .hnf-mobile-alerts-hero button{ flex:0 0 auto; min-height:38px!important; padding:8px 11px!important; border-radius:10px!important; font-size:9px!important; } .hnf-mobile-alerts-toolbar{ display:flex; gap:7px; overflow-x:auto; padding:11px 0 4px; scrollbar-width:none; } .hnf-mobile-alerts-toolbar::-webkit-scrollbar{display:none} .hnf-mobile-alerts-toolbar button{ flex:0 0 auto; min-height:34px!important; padding:7px 11px!important; border-radius:999px!important; background:#17171e!important; border:1px solid #2b2b35!important; color:#9b9ba5!important; font-size:9px!important; } .hnf-mobile-alerts-toolbar button.active{ background:rgba(139,92,246,.16)!important; border-color:rgba(139,92,246,.34)!important; color:#c2b1ff!important; } .hnf-mobile-alerts-list{ display:grid; gap:8px; margin-top:8px; } .hnf-mobile-alert-item{ display:flex; align-items:flex-start; gap:11px; padding:13px; border:1px solid #292933; border-radius:14px; background:#15151c; } .hnf-mobile-alert-item.is-unread{ border-color:rgba(139,92,246,.34); background:linear-gradient(90deg,rgba(139,92,246,.08),#15151c 34%); } .hnf-mobile-alert-icon{ display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:11px; background:#1f1f29; color:#a78bfa; font-size:14px; } .hnf-mobile-alert-icon.workout{ background:rgba(139,92,246,.12); color:#b6a2ff; } .hnf-mobile-alert-icon.progress{ background:rgba(34,197,94,.10); color:#5bd88b; } .hnf-mobile-alert-copy{ flex:1; min-width:0; } .hnf-mobile-alert-title-row{ display:flex; align-items:center; gap:7px; } .hnf-mobile-alert-title-row strong{ font-size:11px; line-height:1.3; } .hnf-mobile-alert-title-row i{ width:7px; height:7px; border-radius:50%; background:#8b5cf6; flex:0 0 7px; } .hnf-mobile-alert-copy p{ margin:4px 0 5px; color:#b0b0ba; font-size:9.5px; line-height:1.4; } .hnf-mobile-alert-copy small{ display:block; color:#777782; font-size:8.5px; } .hnf-mobile-alert-open{ flex:0 0 auto; min-height:34px!important; padding:7px 9px!important; border-radius:9px!important; font-size:8.5px!important; } .hnf-mobile-alert-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:120px; padding:20px; border:1px dashed #2d2d37; border-radius:14px; color:#85858f; text-align:center; font-size:9.5px; } .hnf-mobile-alert-empty strong{ color:#cfcfd6; font-size:12px; } .hnf-client-bottom-btn{ position:relative; } .hnf-bottom-alert-badge{ position:absolute; top:3px; right:18%; min-width:16px; height:16px; padding:0 4px; border-radius:999px; background:#ef4444; color:#fff; font-style:normal; font-size:8px; font-weight:900; line-height:16px; text-align:center; } /* v5.9.4 alerts loader reliability */ .hnf-mobile-alert-empty button{ margin-top:8px; min-height:36px!important; padding:8px 12px!important; border-radius:10px!important; font-size:9px!important; } /* v5.9.5 Alerts unread-first behavior */ .hnf-mobile-alert-item:not(.is-unread){ opacity:.62; background:#121218; border-color:#23232c; } .hnf-mobile-alert-item:not(.is-unread) .hnf-mobile-alert-icon{ filter:saturate(.55); } .hnf-mobile-alert-item:not(.is-unread) .hnf-mobile-alert-copy strong, .hnf-mobile-alert-item:not(.is-unread) .hnf-mobile-alert-copy p{ color:#8d8d97!important; } .hnf-mobile-alerts-toolbar button.active[data-alert-filter="unread"]{ background:rgba(139,92,246,.20)!important; border-color:rgba(139,92,246,.40)!important; color:#d0c2ff!important; } /* v5.9.6 mobile app settings */ .hnf-mobile-header-actions{display:flex;gap:8px;align-items:center} .hnf-mobile-settings-btn{ border:1px solid #2b2b36;background:#17171e;color:#d7d7df;border-radius:10px; padding:10px 12px;font:inherit;font-size:12px;font-weight:700;cursor:pointer } .hnf-mobile-settings-modal[hidden]{display:none!important} .hnf-mobile-settings-modal{position:fixed;inset:0;z-index:999999;display:flex;align-items:flex-end;justify-content:center} .hnf-mobile-settings-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(4px)} .hnf-mobile-settings-sheet{ position:relative;width:min(100%,620px);background:#111117;border:1px solid #2a2a35; border-radius:24px 24px 0 0;padding:20px 18px calc(22px + env(safe-area-inset-bottom)); box-shadow:0 -24px 70px rgba(0,0,0,.48) } .hnf-mobile-settings-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px} .hnf-mobile-settings-head h3{margin:4px 0 0;color:#fff;font-size:22px} .hnf-mobile-settings-close{ width:40px;height:40px;border-radius:12px;border:1px solid #30303a;background:#1a1a22;color:#fff; font-size:26px;line-height:1;cursor:pointer } .hnf-mobile-settings-list{display:grid;gap:10px} .hnf-mobile-settings-list button{ width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left; border:1px solid #292934;background:#17171e;color:#fff;border-radius:16px;padding:15px 16px;cursor:pointer } .hnf-mobile-settings-list button span{display:grid;gap:4px} .hnf-mobile-settings-list button strong{font-size:14px} .hnf-mobile-settings-list button small{font-size:11px;color:#858592;font-weight:500} .hnf-mobile-settings-list button b{font-size:24px;color:#9a72ff} .hnf-mobile-settings-version{text-align:center;color:#666674;font-size:10px;margin-top:16px} html.hnf-settings-open,html.hnf-settings-open body{overflow:hidden!important} /* v5.9.7 Settings entry visibility fix */ .hnf-mobile-settings-launch{ border:0!important; background:linear-gradient(135deg,#7c4dff,#935cff)!important; color:#fff!important; border-radius:10px!important; min-height:38px!important; padding:10px 14px!important; font:inherit!important; font-size:12px!important; font-weight:700!important; cursor:pointer!important; box-shadow:none!important; } html.hnf-client-phone-portrait .hnf-mobile-settings-launch{ display:inline-flex!important; align-items:center!important; justify-content:center!important; } .hnf-mobile-settings-floating{ position:fixed!important; top:max(14px,env(safe-area-inset-top))!important; right:14px!important; z-index:99990!important; width:auto!important; } /* v5.9.8 real client Settings placement */ #hnf-client-settings{ display:inline-flex!important; align-items:center!important; justify-content:center!important; } html.hnf-client-phone-portrait #hnf-client-settings{ display:inline-flex!important; } /* v5.9.9 client settings click/modal hardening */ #hnf-mobile-settings-modal:not([hidden]){ display:flex!important; position:fixed!important; inset:0!important; z-index:2147483000!important; align-items:flex-end!important; justify-content:center!important; } #hnf-mobile-settings-modal .hnf-mobile-settings-sheet{ z-index:2!important; } #hnf-mobile-settings-modal .hnf-mobile-settings-backdrop{ z-index:1!important; } /* v5.9.10 client settings scope fix */ #hnf-client-settings{position:relative;z-index:2} #hnf-mobile-settings-modal:not([hidden]){ display:flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } /* v5.9.11 Mobile update/install prompt visibility fix */ /* Keep bottom app prompts above the fixed client navigation bar. */ html.hnf-client-phone-portrait .hnf-pwa-install, html.hnf-client-phone-portrait .hnf-pwa-install-banner, html.hnf-client-phone-portrait .hnf-app-update-toast, html.hnf-client-phone-portrait .hnf-update-toast, html.hnf-client-phone-portrait [data-hnf-install-prompt], html.hnf-client-phone-portrait [data-hnf-update-prompt]{ bottom:calc(76px + env(safe-area-inset-bottom))!important; z-index:2147482500!important; } /* Fallback for the existing install/update box if it uses fixed positioning without a mobile class. */ html.hnf-client-phone-portrait body > div[style*="position: fixed"][style*="bottom"], html.hnf-client-phone-portrait body > button[style*="position: fixed"][style*="bottom"]{ margin-bottom:calc(72px + env(safe-area-inset-bottom))!important; } /* Keep the navigation itself above normal page content but below modal/update overlays. */ html.hnf-client-phone-portrait .hnf-client-mobile-nav{ z-index:2147482000!important; } /* v5.9.12 Mobile update/install prompt moved to top */ html.hnf-client-phone-portrait .hnf-pwa-install, html.hnf-client-phone-portrait .hnf-pwa-install-banner, html.hnf-client-phone-portrait .hnf-app-update-toast, html.hnf-client-phone-portrait .hnf-update-toast, html.hnf-client-phone-portrait [data-hnf-install-prompt], html.hnf-client-phone-portrait [data-hnf-update-prompt]{ top:calc(14px + env(safe-area-inset-top))!important; bottom:auto!important; left:50%!important; right:auto!important; transform:translateX(-50%)!important; z-index:2147483000!important; max-width:calc(100vw - 24px)!important; } /* Generic fallback for the small fixed update/install prompt used by the app. */ html.hnf-client-phone-portrait body > div[style*="position: fixed"][style*="bottom"], html.hnf-client-phone-portrait body > button[style*="position: fixed"][style*="bottom"]{ top:calc(14px + env(safe-area-inset-top))!important; bottom:auto!important; margin-bottom:0!important; z-index:2147483000!important; } /* If the settings sheet is open, keep the prompt above it rather than behind the bottom nav. */ html.hnf-settings-open .hnf-pwa-install, html.hnf-settings-open .hnf-pwa-install-banner, html.hnf-settings-open .hnf-app-update-toast, html.hnf-settings-open .hnf-update-toast, html.hnf-settings-open [data-hnf-install-prompt], html.hnf-settings-open [data-hnf-update-prompt]{ top:calc(14px + env(safe-area-inset-top))!important; bottom:auto!important; } /* v5.9.14 Trainer Settings */ #hnf-trainer-settings{ display:inline-flex!important; align-items:center!important; justify-content:center!important; } .hnf-trainer-settings-launch{ border:0!important; background:linear-gradient(135deg,#7c4dff,#935cff)!important; color:#fff!important; border-radius:10px!important; min-height:38px!important; padding:10px 14px!important; font:inherit!important; font-size:12px!important; font-weight:700!important; cursor:pointer!important; } #hnf-trainer-settings-modal:not([hidden]){ display:flex!important; position:fixed!important; inset:0!important; z-index:2147483000!important; align-items:flex-end!important; justify-content:center!important; } /* v5.9.15 Phone bottom navigation in portrait + landscape */ html.hnf-client-phone .hnf-client-mobile-nav{ display:grid!important; position:fixed!important; left:0!important; right:0!important; bottom:0!important; width:100%!important; z-index:2147482000!important; padding-bottom:env(safe-area-inset-bottom)!important; } html.hnf-client-phone body{ padding-bottom:calc(72px + env(safe-area-inset-bottom))!important; } /* Ensure landscape phone layouts don't hide the nav via portrait-only rules. */ @media (orientation:landscape){ html.hnf-client-phone .hnf-client-mobile-nav{ display:grid!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; } } /* Keep update/install prompts above the nav in either phone orientation. */ html.hnf-client-phone #hnf-pwa-update, html.hnf-client-phone #hnf-pwa-install-wrap, html.hnf-client-phone #hnf-pwa-install-help{ z-index:2147483000!important; } /* v5.9.16 definitive mobile landscape nav fix */ @media (orientation:landscape){ html.hnf-client-mobile-device #hnf-client-bottom-nav, html.hnf-client-phone #hnf-client-bottom-nav{ display:grid!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; position:fixed!important; left:0!important; right:0!important; bottom:0!important; width:100%!important; z-index:2147482000!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; background:rgba(15,15,20,.96)!important; border-top:1px solid #2d2d38!important; padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important; } html.hnf-client-mobile-device body, html.hnf-client-phone body{ padding-bottom:calc(72px + env(safe-area-inset-bottom))!important; } } /* v5.9.23: use the existing trainer nav cards as the phone bottom navigation. No extra trainer nav DOM is created, so the working trainer dashboard is left untouched. */ @media (orientation:portrait), (orientation:landscape){ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid{ display:grid!important; position:fixed!important; left:0!important; right:0!important; bottom:0!important; width:100%!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:0!important; margin:0!important; padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important; background:rgba(15,15,20,.98)!important; border-top:1px solid #2d2d38!important; z-index:2147482000!important; box-shadow:0 -10px 28px rgba(0,0,0,.32)!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card{ min-width:0!important; min-height:49px!important; height:auto!important; margin:0!important; padding:5px 4px!important; border:0!important; border-radius:11px!important; background:transparent!important; box-shadow:none!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:3px!important; color:#9999a5!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card.active{ background:rgba(124,77,255,.24)!important; color:#fff!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card strong{ font-size:14px!important; line-height:1!important; color:inherit!important; margin:0!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card span{ font-size:9px!important; line-height:1.1!important; color:inherit!important; margin:0!important; } /* First existing card opens Overview/Clients, so label it Home on the mobile bar. */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card:first-child span{ font-size:0!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card:first-child span::after{ content:'Home'; font-size:9px!important; } html.hnf-trainer-phone body{ padding-bottom:calc(74px + env(safe-area-inset-bottom))!important; } html.hnf-trainer-phone #hnf-trainer-dashboard{ padding-bottom:24px!important; } } /* v5.9.24 Trainer mobile dashboard polish — CSS only, no trainer logic changes */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]){ width:100%!important; max-width:none!important; margin:0!important; padding:14px 14px calc(92px + env(safe-area-inset-bottom))!important; box-sizing:border-box!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head{ display:grid!important; grid-template-columns:1fr!important; gap:14px!important; align-items:start!important; margin-bottom:16px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head h2{ font-size:24px!important; line-height:1.08!important; margin:0 0 6px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head .hnf-muted{ font-size:12px!important; line-height:1.45!important; margin:0!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; width:100%!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions > *{ width:100%!important; min-width:0!important; min-height:40px!important; margin:0!important; padding:8px 10px!important; font-size:10px!important; border-radius:10px!important; box-sizing:border-box!important; } html.hnf-trainer-phone #hnf-trainer-dashboard #hnf-trainer-settings{ grid-column:1 / -1!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-panel{ margin-top:0!important; padding-bottom:14px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-panel-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:10px!important; margin-bottom:12px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-panel-head h3{ font-size:18px!important; line-height:1.15!important; margin:0 0 4px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-panel-head .hnf-muted{ font-size:11px!important; line-height:1.4!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-stats{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; margin:10px 0 12px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-stats > div{ padding:12px!important; border-radius:12px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-stats span{ font-size:10px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-stats strong{ font-size:22px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-grid{ grid-template-columns:1fr!important; gap:10px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-card, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-adherence-panel, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-coaching-panel{ border-radius:14px!important; padding:13px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-list, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-client-list, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-workout-list, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-program-list{ gap:9px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard input, html.hnf-trainer-phone #hnf-trainer-dashboard select, html.hnf-trainer-phone #hnf-trainer-dashboard textarea{ min-height:42px!important; font-size:16px!important; } /* Keep the working 5.9.23 bottom nav compact and readable. */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid{ min-height:64px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card strong{ font-size:13px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card span, html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card:first-child span::after{ font-size:9px!important; } /* Landscape: use the extra width without removing mobile navigation. */ @media (orientation:landscape){ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]){ padding-left:18px!important; padding-right:18px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions{ grid-template-columns:repeat(4,minmax(0,1fr))!important; } html.hnf-trainer-phone #hnf-trainer-dashboard #hnf-trainer-settings{ grid-column:auto!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-stats{ grid-template-columns:repeat(4,minmax(0,1fr))!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-daily-grid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } } /* v5.9.25 Trainer mobile panel polish — CSS only */ html.hnf-trainer-phone #hnf-panel-exercises, html.hnf-trainer-phone #hnf-panel-workouts, html.hnf-trainer-phone #hnf-panel-programs{ width:100%!important; max-width:none!important; padding-bottom:18px!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head{ position:sticky!important; top:0!important; z-index:30!important; background:rgba(16,16,22,.96)!important; backdrop-filter:blur(12px)!important; border-bottom:1px solid rgba(255,255,255,.06)!important; padding:10px 0!important; margin:0 0 12px!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head h3, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head h3, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head h3{ font-size:19px!important; margin:0!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head button, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head button, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head button{ min-height:40px!important; border-radius:10px!important; padding:9px 12px!important; font-size:11px!important; white-space:nowrap!important; } /* Make trainer list rows touch-friendly on mobile. */ html.hnf-trainer-phone #hnf-panel-exercises .hnf-list > *, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list > *, html.hnf-trainer-phone #hnf-panel-programs .hnf-list > *{ border-radius:14px!important; padding:13px!important; margin-bottom:9px!important; min-width:0!important; } html.hnf-trainer-phone #hnf-panel-exercises button, html.hnf-trainer-phone #hnf-panel-workouts button, html.hnf-trainer-phone #hnf-panel-programs button{ min-height:38px!important; } /* Stack dense row actions in portrait so Edit / Delete / Assign remain tappable. */ @media (orientation:portrait){ html.hnf-trainer-phone #hnf-panel-exercises .hnf-row, html.hnf-trainer-phone #hnf-panel-workouts .hnf-row, html.hnf-trainer-phone #hnf-panel-programs .hnf-row, html.hnf-trainer-phone #hnf-panel-exercises .hnf-list-item, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list-item, html.hnf-trainer-phone #hnf-panel-programs .hnf-list-item{ align-items:flex-start!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-actions, html.hnf-trainer-phone #hnf-panel-workouts .hnf-actions, html.hnf-trainer-phone #hnf-panel-programs .hnf-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; margin-top:9px!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-actions > *, html.hnf-trainer-phone #hnf-panel-workouts .hnf-actions > *, html.hnf-trainer-phone #hnf-panel-programs .hnf-actions > *{ width:100%!important; min-width:0!important; } } /* Forms and modal builders are easier to use on a phone. */ html.hnf-trainer-phone .hnf-modal-card{ width:min(94vw,680px)!important; max-height:88vh!important; overflow:auto!important; border-radius:18px!important; padding:16px!important; } html.hnf-trainer-phone .hnf-modal-card input, html.hnf-trainer-phone .hnf-modal-card select, html.hnf-trainer-phone .hnf-modal-card textarea{ width:100%!important; min-height:42px!important; font-size:16px!important; box-sizing:border-box!important; } html.hnf-trainer-phone .hnf-modal-actions{ position:sticky!important; bottom:0!important; background:rgba(18,18,24,.96)!important; padding-top:10px!important; margin-top:12px!important; z-index:5!important; } @media (orientation:landscape){ html.hnf-trainer-phone #hnf-panel-exercises .hnf-list, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list, html.hnf-trainer-phone #hnf-panel-programs .hnf-list{ max-width:none!important; } } /* v5.9.26 trainer mobile nav clickability fix */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid{ pointer-events:auto!important; touch-action:manipulation!important; isolation:isolate!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card{ pointer-events:auto!important; touch-action:manipulation!important; cursor:pointer!important; position:relative!important; z-index:2147482001!important; user-select:none!important; -webkit-user-select:none!important; -webkit-tap-highlight-color:transparent!important; } /* v5.9.27 force trainer panel switching */ #hnf-trainer-dashboard .hnf-panel[hidden]{ display:none!important; } #hnf-trainer-dashboard .hnf-panel.active:not([hidden]){ display:block!important; } /* v5.9.28 Trainer library screens refinement — navigation logic untouched */ html.hnf-trainer-phone #hnf-panel-exercises.active:not([hidden]), html.hnf-trainer-phone #hnf-panel-workouts.active:not([hidden]), html.hnf-trainer-phone #hnf-panel-programs.active:not([hidden]){ display:block!important; margin-top:0!important; border:0!important; background:transparent!important; padding:0 0 18px!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head{ min-height:54px!important; padding:10px 2px!important; margin:0 0 10px!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head h3, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head h3, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head h3{ font-size:20px!important; letter-spacing:-.02em!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-panel-head button, html.hnf-trainer-phone #hnf-panel-workouts .hnf-panel-head button, html.hnf-trainer-phone #hnf-panel-programs .hnf-panel-head button{ min-width:92px!important; min-height:42px!important; } /* Search/filter controls, where present, should span the phone cleanly. */ html.hnf-trainer-phone #hnf-panel-exercises input[type="search"], html.hnf-trainer-phone #hnf-panel-workouts input[type="search"], html.hnf-trainer-phone #hnf-panel-programs input[type="search"], html.hnf-trainer-phone #hnf-panel-exercises select, html.hnf-trainer-phone #hnf-panel-workouts select, html.hnf-trainer-phone #hnf-panel-programs select{ width:100%!important; max-width:none!important; min-height:44px!important; border-radius:11px!important; margin-bottom:8px!important; } /* Cleaner library cards. */ html.hnf-trainer-phone #hnf-panel-exercises .hnf-list > *, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list > *, html.hnf-trainer-phone #hnf-panel-programs .hnf-list > *{ background:#14141b!important; border:1px solid #292933!important; box-shadow:none!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-list strong, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list strong, html.hnf-trainer-phone #hnf-panel-programs .hnf-list strong{ font-size:15px!important; line-height:1.25!important; } html.hnf-trainer-phone #hnf-panel-exercises .hnf-list small, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list small, html.hnf-trainer-phone #hnf-panel-programs .hnf-list small, html.hnf-trainer-phone #hnf-panel-exercises .hnf-list .hnf-muted, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list .hnf-muted, html.hnf-trainer-phone #hnf-panel-programs .hnf-list .hnf-muted{ font-size:11px!important; line-height:1.4!important; } /* Make long exercise/workout/program names wrap instead of colliding with actions. */ html.hnf-trainer-phone #hnf-panel-exercises .hnf-list *, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list *, html.hnf-trainer-phone #hnf-panel-programs .hnf-list *{ overflow-wrap:anywhere; } /* Landscape can show library cards more efficiently while retaining the bottom nav. */ @media (orientation:landscape){ html.hnf-trainer-phone #hnf-panel-exercises .hnf-list, html.hnf-trainer-phone #hnf-panel-workouts .hnf-list, html.hnf-trainer-phone #hnf-panel-programs .hnf-list{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } } /* v5.9.29 desktop trainer navigation */ .hnf-trainer-desktop-nav{ display:flex; align-items:center; gap:8px; margin:18px 0 16px; padding:6px; border:1px solid #292933; border-radius:14px; background:#101016; width:max-content; max-width:100%; } .hnf-trainer-desktop-nav-btn{ appearance:none; border:1px solid transparent; background:transparent; color:#b8b8c5; min-height:42px; padding:10px 18px; border-radius:10px; font:inherit; font-weight:700; cursor:pointer; transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease; } .hnf-trainer-desktop-nav-btn:hover{ color:#fff; background:#181820; border-color:#32323d; } .hnf-trainer-desktop-nav-btn:active{ transform:translateY(1px); } .hnf-trainer-desktop-nav-btn.active, .hnf-trainer-desktop-nav-btn[aria-current="page"]{ color:#fff; background:rgba(132,82,255,.18); border-color:#8757ff; box-shadow:inset 0 0 0 1px rgba(135,87,255,.12); } html.hnf-trainer-phone .hnf-trainer-desktop-nav{ display:none!important; } @media (max-width:900px){ .hnf-trainer-desktop-nav{ display:none!important; } } /* v5.9.30 Desktop trainer workspace expansion — mobile/navigation logic untouched */ @media (min-width:901px){ #hnf-trainer-dashboard{ width:min(1180px,calc(100vw - 80px))!important; max-width:1180px!important; margin-left:auto!important; margin-right:auto!important; } #hnf-trainer-dashboard > .hnf-card, #hnf-trainer-dashboard .hnf-app-shell, #hnf-trainer-dashboard .hnf-trainer-shell{ max-width:none!important; } #hnf-trainer-dashboard .hnf-trainer-header, #hnf-trainer-dashboard .hnf-trainer-top{ display:grid!important; grid-template-columns:minmax(260px,1fr) minmax(520px,1.7fr)!important; gap:24px!important; align-items:start!important; } #hnf-trainer-dashboard .hnf-trainer-grid{ grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:12px!important; margin-top:16px!important; } #hnf-trainer-dashboard .hnf-trainer-stat{ min-height:84px!important; padding:16px!important; text-align:left!important; } #hnf-trainer-dashboard .hnf-trainer-stat strong{ font-size:28px!important; line-height:1!important; } #hnf-trainer-dashboard .hnf-trainer-stat span{ margin-top:8px!important; display:block!important; } #hnf-trainer-dashboard .hnf-panel{ padding:24px!important; border-radius:18px!important; } #hnf-trainer-dashboard #hnf-panel-overview.active:not([hidden]){ display:block!important; } #hnf-trainer-dashboard .hnf-daily-dashboard{ margin-bottom:22px!important; } #hnf-trainer-dashboard .hnf-daily-stats{ grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:12px!important; } #hnf-trainer-dashboard .hnf-daily-dashboard > .hnf-grid, #hnf-trainer-dashboard .hnf-overview-grid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:16px!important; } #hnf-panel-exercises .hnf-panel-head, #hnf-panel-workouts .hnf-panel-head, #hnf-panel-programs .hnf-panel-head{ align-items:center!important; } #hnf-panel-exercises .hnf-list, #hnf-panel-workouts .hnf-list{ width:100%!important; } #hnf-panel-programs .hnf-program-card, #hnf-panel-workouts .hnf-workout-card, #hnf-panel-exercises .hnf-exercise-row{ max-width:none!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ width:100%!important; justify-content:flex-start!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav-btn{ min-width:120px!important; } } /* Very wide desktop screens get a little more breathing room without stretching excessively. */ @media (min-width:1440px){ #hnf-trainer-dashboard{ width:min(1280px,calc(100vw - 120px))!important; max-width:1280px!important; } } /* v5.9.31 embed desktop trainer navigation inside the dashboard */ @media (min-width:901px){ #hnf-trainer-dashboard .hnf-trainer-desktop-nav-wrap{ width:100%; margin:18px 0 14px; padding-top:14px; border-top:1px solid #262630; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ width:100%!important; max-width:none!important; margin:0!important; padding:6px!important; border-radius:12px!important; background:#0f0f15!important; border:1px solid #292933!important; box-sizing:border-box!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav-btn{ flex:1 1 0!important; min-width:0!important; justify-content:center!important; text-align:center!important; } } html.hnf-trainer-phone .hnf-trainer-desktop-nav-wrap{ display:none!important; } /* v5.9.32 desktop trainer nav placement fix Avoid WordPress/theme global NAV rules and keep this control inside the trainer card. */ @media (min-width:901px){ #hnf-trainer-dashboard .hnf-trainer-desktop-nav-wrap{ position:relative!important; inset:auto!important; top:auto!important; right:auto!important; bottom:auto!important; left:auto!important; z-index:1!important; float:none!important; transform:none!important; width:100%!important; max-width:100%!important; box-sizing:border-box!important; overflow:visible!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ position:static!important; inset:auto!important; top:auto!important; right:auto!important; bottom:auto!important; left:auto!important; z-index:auto!important; float:none!important; transform:none!important; display:flex!important; flex-direction:row!important; align-items:center!important; justify-content:stretch!important; gap:8px!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:0!important; margin:0!important; box-sizing:border-box!important; overflow:visible!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav > .hnf-trainer-desktop-nav-btn{ position:static!important; inset:auto!important; float:none!important; transform:none; flex:1 1 0!important; width:auto!important; max-width:none!important; min-width:0!important; height:44px!important; margin:0!important; box-sizing:border-box!important; } } /* v5.9.33 Desktop trainer header controls consolidation Mobile layouts and all button logic remain untouched. */ @media (min-width:901px){ #hnf-trainer-dashboard .hnf-trainer-head{ grid-template-columns:minmax(260px,.9fr) minmax(520px,1.6fr)!important; gap:26px!important; align-items:center!important; } #hnf-trainer-dashboard .hnf-push-actions{ display:flex!important; flex-wrap:wrap!important; align-items:center!important; justify-content:flex-end!important; gap:8px!important; } /* Keep the essential desktop controls visible. */ #hnf-trainer-dashboard #hnf-trainer-push-status, #hnf-trainer-dashboard #hnf-trainer-push-enable, #hnf-trainer-dashboard #hnf-trainer-notification-history, #hnf-trainer-dashboard #hnf-trainer-logout, #hnf-trainer-dashboard #hnf-trainer-settings{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:40px!important; margin:0!important; } /* Advanced controls stay available through Settings, but no longer clutter Home. */ #hnf-trainer-dashboard #hnf-trainer-push-test, #hnf-trainer-dashboard #hnf-trainer-push-diagnostics, #hnf-trainer-dashboard #hnf-trainer-app-update, #hnf-trainer-dashboard #hnf-trainer-push-prefs{ display:none!important; } #hnf-trainer-dashboard #hnf-trainer-push-status{ padding:9px 12px!important; border-radius:999px!important; white-space:nowrap!important; } #hnf-trainer-dashboard #hnf-trainer-push-enable, #hnf-trainer-dashboard #hnf-trainer-notification-history, #hnf-trainer-dashboard #hnf-trainer-logout, #hnf-trainer-dashboard #hnf-trainer-settings{ padding:9px 14px!important; border-radius:10px!important; white-space:nowrap!important; } #hnf-trainer-dashboard #hnf-trainer-settings{ min-width:88px!important; } /* The Settings sheet is also usable on desktop as the advanced-control hub. */ #hnf-trainer-dashboard .hnf-mobile-settings-modal:not([hidden]){ position:fixed!important; inset:0!important; z-index:2147483000!important; display:flex!important; align-items:center!important; justify-content:center!important; padding:28px!important; box-sizing:border-box!important; } #hnf-trainer-dashboard .hnf-mobile-settings-backdrop{ position:absolute!important; inset:0!important; } #hnf-trainer-dashboard .hnf-mobile-settings-sheet{ position:relative!important; inset:auto!important; width:min(460px,calc(100vw - 56px))!important; max-width:460px!important; max-height:min(720px,calc(100vh - 70px))!important; margin:0!important; border-radius:18px!important; overflow:auto!important; } } /* v5.9.34 compact collapsible program weeks */ .hnf-program-weeks{ display:flex!important; flex-direction:column!important; gap:9px!important; } .hnf-program-week{ border:1px solid #292933!important; border-radius:13px!important; background:#14141b!important; overflow:hidden!important; } .hnf-program-week > summary{ list-style:none!important; cursor:pointer!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; min-height:54px!important; padding:12px 14px!important; user-select:none!important; -webkit-user-select:none!important; } .hnf-program-week > summary::-webkit-details-marker{ display:none!important; } .hnf-program-week > summary > span:first-child{ display:flex!important; align-items:baseline!important; gap:10px!important; min-width:0!important; } .hnf-program-week > summary strong{ font-size:15px!important; line-height:1.2!important; } .hnf-program-week > summary small{ color:#8f8f9d!important; font-size:11px!important; white-space:nowrap!important; } .hnf-program-week-chevron{ font-size:18px!important; line-height:1!important; color:#a889ff!important; transition:transform .18s ease!important; } .hnf-program-week[open] .hnf-program-week-chevron{ transform:rotate(180deg)!important; } .hnf-program-week-body{ border-top:1px solid #292933!important; } .hnf-program-week-item{ margin:0!important; border:0!important; border-bottom:1px solid #24242d!important; border-radius:0!important; background:transparent!important; } .hnf-program-week-item:last-child{ border-bottom:0!important; } .hnf-program-week-item .hnf-drag-num{ min-width:42px!important; width:auto!important; padding:0 8px!important; border-radius:999px!important; font-size:10px!important; text-transform:uppercase!important; } @media (min-width:901px){ #hnf-panel-programs .hnf-program-card{ padding:16px!important; } #hnf-panel-programs .hnf-workout-title{ margin-bottom:12px!important; } #hnf-panel-programs .hnf-program-weeks{ gap:8px!important; } #hnf-panel-programs .hnf-program-week > summary{ min-height:50px!important; } } /* v5.9.35 program week details and expand/collapse controls */ #hnf-panel-programs .hnf-program-card > .hnf-workout-title .hnf-row-actions{ gap:7px!important; flex-wrap:wrap!important; justify-content:flex-end!important; } #hnf-panel-programs .hnf-expand-program-weeks, #hnf-panel-programs .hnf-collapse-program-weeks{ background:#1b1b24!important; border-color:#353542!important; color:#cfcfe0!important; } #hnf-panel-programs .hnf-program-week-item{ display:grid!important; grid-template-columns:auto minmax(0,1fr) auto!important; align-items:center!important; gap:12px!important; padding:12px 14px!important; } #hnf-panel-programs .hnf-program-week-item .hnf-workout-item-main{ min-width:0!important; } #hnf-panel-programs .hnf-program-week-item .hnf-workout-item-main strong{ display:block!important; font-size:14px!important; line-height:1.25!important; margin-bottom:3px!important; } #hnf-panel-programs .hnf-program-week-item .hnf-workout-item-main span{ display:block!important; font-size:11px!important; line-height:1.35!important; color:#8f8f9d!important; } @media (max-width:900px){ #hnf-panel-programs .hnf-program-card > .hnf-workout-title .hnf-row-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; } #hnf-panel-programs .hnf-program-card > .hnf-workout-title .hnf-row-actions > *{ width:100%!important; } #hnf-panel-programs .hnf-program-week-item{ grid-template-columns:auto minmax(0,1fr)!important; } #hnf-panel-programs .hnf-program-week-item > .hnf-row-actions{ grid-column:1 / -1!important; width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; } } /* v5.9.36 professional workout cards */ #hnf-panel-workouts .hnf-workout-card-v2{ border:1px solid #292933!important; border-radius:16px!important; background:#14141b!important; padding:16px!important; margin-bottom:12px!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:16px!important; margin-bottom:0!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title > div:first-child{ min-width:0!important; flex:1 1 auto!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title strong{ display:block!important; font-size:20px!important; line-height:1.2!important; margin-bottom:4px!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title span{ display:block!important; font-size:11px!important; color:#9393a1!important; line-height:1.4!important; } #hnf-panel-workouts .hnf-workout-description{ display:block!important; margin-top:6px!important; color:#b2b2bf!important; font-size:11px!important; line-height:1.45!important; } #hnf-panel-workouts .hnf-workout-details{ margin-top:12px!important; border:1px solid #292933!important; border-radius:13px!important; overflow:hidden!important; background:#101016!important; } #hnf-panel-workouts .hnf-workout-details > summary{ list-style:none!important; cursor:pointer!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; padding:12px 14px!important; min-height:52px!important; user-select:none!important; -webkit-user-select:none!important; } #hnf-panel-workouts .hnf-workout-details > summary::-webkit-details-marker{ display:none!important; } #hnf-panel-workouts .hnf-workout-details > summary > span:first-child{ display:flex!important; align-items:baseline!important; gap:10px!important; } #hnf-panel-workouts .hnf-workout-details > summary strong{ font-size:14px!important; } #hnf-panel-workouts .hnf-workout-details > summary small{ color:#858593!important; font-size:11px!important; } #hnf-panel-workouts .hnf-workout-chevron{ color:#a889ff!important; font-size:18px!important; transition:transform .18s ease!important; } #hnf-panel-workouts .hnf-workout-details[open] .hnf-workout-chevron{ transform:rotate(180deg)!important; } #hnf-panel-workouts .hnf-workout-exercise-list{ border-top:1px solid #292933!important; } #hnf-panel-workouts .hnf-workout-exercise-item{ display:grid!important; grid-template-columns:auto minmax(0,1fr) auto!important; align-items:center!important; gap:12px!important; padding:12px 14px!important; margin:0!important; border:0!important; border-bottom:1px solid #24242d!important; border-radius:0!important; background:transparent!important; } #hnf-panel-workouts .hnf-workout-exercise-item:last-child{ border-bottom:0!important; } #hnf-panel-workouts .hnf-workout-exercise-item .hnf-drag-num{ width:30px!important; min-width:30px!important; height:30px!important; border-radius:999px!important; display:flex!important; align-items:center!important; justify-content:center!important; font-size:11px!important; } #hnf-panel-workouts .hnf-workout-exercise-item .hnf-workout-item-main strong{ display:block!important; font-size:14px!important; line-height:1.25!important; } #hnf-panel-workouts .hnf-workout-exercise-item .hnf-workout-item-main span, #hnf-panel-workouts .hnf-workout-exercise-item .hnf-workout-item-main small{ display:block!important; font-size:11px!important; color:#90909d!important; line-height:1.4!important; margin-top:2px!important; } @media (max-width:900px){ #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title{ flex-direction:column!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title .hnf-row-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; } #hnf-panel-workouts .hnf-workout-card-v2 .hnf-workout-title .hnf-row-actions > *{ width:100%!important; } #hnf-panel-workouts .hnf-workout-exercise-item{ grid-template-columns:auto minmax(0,1fr)!important; } #hnf-panel-workouts .hnf-workout-exercise-item > .hnf-row-actions{ grid-column:1 / -1!important; width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; } } /* v5.9.37 Exercise Library refinement */ #hnf-panel-exercises #hnf-exercises-list{ width:100%!important; } #hnf-panel-exercises .hnf-exercise-card-v2{ border:1px solid #292933!important; border-radius:14px!important; background:#14141b!important; padding:14px!important; min-width:0!important; } #hnf-panel-exercises .hnf-exercise-card-main{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:16px!important; } #hnf-panel-exercises .hnf-exercise-card-copy{ min-width:0!important; flex:1 1 auto!important; } #hnf-panel-exercises .hnf-exercise-card-copy strong{ display:block!important; font-size:16px!important; line-height:1.25!important; margin-bottom:4px!important; } #hnf-panel-exercises .hnf-exercise-card-copy span{ display:block!important; color:#9393a1!important; font-size:11px!important; line-height:1.4!important; } #hnf-panel-exercises .hnf-exercise-card-copy small{ display:block!important; margin-top:7px!important; color:#b5b5c0!important; font-size:11px!important; line-height:1.45!important; } #hnf-panel-exercises .hnf-exercise-card-actions{ flex:0 0 auto!important; display:flex!important; align-items:center!important; justify-content:flex-end!important; gap:7px!important; flex-wrap:wrap!important; } #hnf-panel-exercises .hnf-exercise-card-actions .hnf-small-btn{ min-height:36px!important; padding:8px 12px!important; } @media (min-width:901px){ #hnf-panel-exercises #hnf-exercises-list{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } #hnf-panel-exercises .hnf-exercise-card-main{ height:100%!important; } } @media (max-width:900px){ #hnf-panel-exercises #hnf-exercises-list{ display:flex!important; flex-direction:column!important; gap:9px!important; } #hnf-panel-exercises .hnf-exercise-card-main{ flex-direction:column!important; } #hnf-panel-exercises .hnf-exercise-card-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; } #hnf-panel-exercises .hnf-exercise-card-actions > *{ width:100%!important; } } /* v5.9.38 compact exercise instruction preview */ #hnf-panel-exercises .hnf-exercise-instructions{ margin-top:7px!important; } #hnf-panel-exercises .hnf-exercise-instructions-preview{ display:-webkit-box!important; -webkit-box-orient:vertical!important; -webkit-line-clamp:3!important; overflow:hidden!important; margin:0!important; color:#b5b5c0!important; font-size:11px!important; line-height:1.45!important; } #hnf-panel-exercises .hnf-exercise-details{ margin-top:7px!important; } #hnf-panel-exercises .hnf-exercise-details > summary{ display:inline-flex!important; align-items:center!important; cursor:pointer!important; list-style:none!important; color:#a889ff!important; font-size:11px!important; font-weight:700!important; line-height:1.2!important; user-select:none!important; -webkit-user-select:none!important; } #hnf-panel-exercises .hnf-exercise-details > summary::-webkit-details-marker{ display:none!important; } #hnf-panel-exercises .hnf-exercise-details > summary::after{ content:' + '!important; margin-left:4px!important; } #hnf-panel-exercises .hnf-exercise-details[open] > summary::after{ content:' −'!important; } #hnf-panel-exercises .hnf-exercise-details-body{ margin-top:8px!important; padding:10px 11px!important; border:1px solid #292933!important; border-radius:10px!important; background:#101016!important; color:#c3c3cc!important; font-size:11px!important; line-height:1.55!important; white-space:normal!important; } #hnf-panel-exercises .hnf-exercise-details[open] + *{ margin-top:0!important; } /* Hide the preview while the full instructions are expanded. */ #hnf-panel-exercises .hnf-exercise-instructions:has(.hnf-exercise-details[open]) .hnf-exercise-instructions-preview{ display:none!important; } @media (min-width:901px){ #hnf-panel-exercises .hnf-exercise-card-v2{ align-self:start!important; } } /* v5.9.39 Client management snapshot cards */ #hnf-clients-list{ width:100%!important; } .hnf-client-card-v2{ border:1px solid #292933!important; border-radius:15px!important; background:#14141b!important; padding:15px!important; min-width:0!important; } .hnf-client-card-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:14px!important; padding-bottom:12px!important; border-bottom:1px solid #262630!important; } .hnf-client-card-identity{ min-width:0!important; } .hnf-client-card-identity > strong{ display:block!important; font-size:18px!important; line-height:1.2!important; margin-bottom:4px!important; } .hnf-client-card-identity > span, .hnf-client-card-identity > small{ display:block!important; color:#9494a1!important; font-size:11px!important; line-height:1.4!important; overflow-wrap:anywhere!important; } .hnf-client-card-identity > small{ color:#b7b7c2!important; margin-top:4px!important; } .hnf-client-card-status{ display:flex!important; flex-wrap:wrap!important; justify-content:flex-end!important; align-items:center!important; gap:6px!important; } .hnf-client-snapshot{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:8px!important; margin:12px 0!important; } .hnf-client-snapshot > div{ min-width:0!important; border:1px solid #282832!important; background:#101016!important; border-radius:11px!important; padding:10px!important; } .hnf-client-snapshot > div > span{ display:block!important; color:#858593!important; font-size:10px!important; line-height:1.2!important; text-transform:uppercase!important; letter-spacing:.04em!important; margin-bottom:5px!important; } .hnf-client-snapshot > div > strong{ display:block!important; color:#f2f2f5!important; font-size:12px!important; line-height:1.35!important; overflow-wrap:anywhere!important; } .hnf-client-snapshot > div > small{ display:block!important; color:#777786!important; font-size:10px!important; line-height:1.3!important; margin-top:4px!important; } .hnf-client-card-actions{ display:flex!important; align-items:center!important; justify-content:flex-end!important; flex-wrap:wrap!important; gap:7px!important; } @media (min-width:901px){ #hnf-clients-list{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; } .hnf-client-card-v2{ align-self:start!important; } .hnf-client-snapshot{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } } @media (max-width:900px){ #hnf-clients-list{ display:flex!important; flex-direction:column!important; gap:10px!important; } .hnf-client-card-head{ flex-direction:column!important; } .hnf-client-card-status{ justify-content:flex-start!important; } .hnf-client-snapshot{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } .hnf-client-card-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; } .hnf-client-card-actions > *{ width:100%!important; min-width:0!important; } } @media (max-width:520px){ .hnf-client-snapshot{ grid-template-columns:1fr!important; } } /* v5.9.40 client button/navigation fix */ #hnf-clients-section{ scroll-margin-top:70px!important; } /* v5.9.41 Detailed client workspace polish — CSS only */ #hnf-trainer-dashboard .hnf-client-workspace, #hnf-trainer-dashboard .hnf-client-detail, #hnf-trainer-dashboard .hnf-client-view{ width:100%!important; max-width:none!important; box-sizing:border-box!important; } #hnf-trainer-dashboard .hnf-workspace-section-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:14px!important; } #hnf-trainer-dashboard .hnf-workspace-section-head h3, #hnf-trainer-dashboard .hnf-workspace-section-head h4{ margin:0!important; line-height:1.2!important; } #hnf-trainer-dashboard .hnf-workspace-section-head .hnf-muted{ margin:4px 0 0!important; line-height:1.4!important; } #hnf-trainer-dashboard .hnf-client-summary, #hnf-trainer-dashboard .hnf-client-overview, #hnf-trainer-dashboard .hnf-client-workspace-card, #hnf-trainer-dashboard .hnf-client-detail-card{ border:1px solid #292933!important; border-radius:14px!important; background:#14141b!important; } #hnf-trainer-dashboard .hnf-client-workspace button, #hnf-trainer-dashboard .hnf-client-detail button, #hnf-trainer-dashboard .hnf-client-view button{ min-height:36px!important; } /* Make repeated client metric cards easier to scan on desktop. */ @media (min-width:901px){ #hnf-trainer-dashboard .hnf-client-workspace .hnf-grid, #hnf-trainer-dashboard .hnf-client-detail .hnf-grid, #hnf-trainer-dashboard .hnf-client-view .hnf-grid{ gap:12px!important; } #hnf-trainer-dashboard .hnf-client-workspace .hnf-stat-grid, #hnf-trainer-dashboard .hnf-client-detail .hnf-stat-grid, #hnf-trainer-dashboard .hnf-client-view .hnf-stat-grid{ grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:10px!important; } #hnf-trainer-dashboard .hnf-client-workspace .hnf-two-col, #hnf-trainer-dashboard .hnf-client-detail .hnf-two-col, #hnf-trainer-dashboard .hnf-client-view .hnf-two-col{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:14px!important; } #hnf-trainer-dashboard .hnf-client-workspace .hnf-three-col, #hnf-trainer-dashboard .hnf-client-detail .hnf-three-col, #hnf-trainer-dashboard .hnf-client-view .hnf-three-col{ grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:12px!important; } #hnf-trainer-dashboard .hnf-compare-table{ overflow:hidden!important; border-radius:12px!important; border:1px solid #292933!important; } #hnf-trainer-dashboard .hnf-compare-row{ grid-template-columns:minmax(130px,1.2fr) repeat(3,minmax(90px,1fr))!important; gap:8px!important; align-items:center!important; } } /* Cleaner mobile client workspace after opening View client. */ @media (max-width:900px){ #hnf-trainer-dashboard .hnf-client-workspace, #hnf-trainer-dashboard .hnf-client-detail, #hnf-trainer-dashboard .hnf-client-view{ padding-left:0!important; padding-right:0!important; } #hnf-trainer-dashboard .hnf-workspace-section-head{ flex-direction:column!important; align-items:stretch!important; } #hnf-trainer-dashboard .hnf-workspace-section-head .hnf-row-actions, #hnf-trainer-dashboard .hnf-client-workspace .hnf-row-actions, #hnf-trainer-dashboard .hnf-client-detail .hnf-row-actions, #hnf-trainer-dashboard .hnf-client-view .hnf-row-actions{ width:100%!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:7px!important; } #hnf-trainer-dashboard .hnf-workspace-section-head .hnf-row-actions > *, #hnf-trainer-dashboard .hnf-client-workspace .hnf-row-actions > *, #hnf-trainer-dashboard .hnf-client-detail .hnf-row-actions > *, #hnf-trainer-dashboard .hnf-client-view .hnf-row-actions > *{ width:100%!important; min-width:0!important; } #hnf-trainer-dashboard .hnf-compare-table{ overflow-x:auto!important; -webkit-overflow-scrolling:touch!important; } #hnf-trainer-dashboard .hnf-compare-row{ min-width:560px!important; } #hnf-trainer-dashboard svg{ max-width:100%!important; height:auto!important; } } /* v5.9.42 collapsible coaching workspace */ .hnf-workspace-section-toolbar{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; margin:12px 0 8px!important; } .hnf-workspace-section-toolbar>span{ color:#92929f!important; font-size:11px!important; font-weight:700!important; text-transform:uppercase!important; letter-spacing:.05em!important; } .hnf-workspace-section-toolbar>div{ display:flex!important; gap:6px!important; } .hnf-workspace-collapsible{ margin:8px 0!important; border:1px solid #292933!important; border-radius:13px!important; background:#121218!important; overflow:hidden!important; } .hnf-workspace-collapsible>summary{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; cursor:pointer!important; list-style:none!important; padding:12px 14px!important; user-select:none!important; -webkit-user-select:none!important; } .hnf-workspace-collapsible>summary::-webkit-details-marker{display:none!important} .hnf-workspace-collapsible>summary strong{ color:#f5f5f7!important; font-size:14px!important; } .hnf-workspace-collapsible>summary span{ color:#8f8f9c!important; font-size:10px!important; text-align:right!important; } .hnf-workspace-collapsible>summary:after{ content:'›'!important; color:#9b6cff!important; font-size:20px!important; line-height:1!important; transform:rotate(90deg)!important; transition:transform .16s ease!important; } .hnf-workspace-collapsible[open]>summary:after{ transform:rotate(-90deg)!important; } .hnf-workspace-collapsible[open]>summary{ border-bottom:1px solid #292933!important; } .hnf-workspace-collapsible-body{ padding:12px!important; } .hnf-workspace-collapsible-body>section{ margin:0!important; border:0!important; padding:0!important; background:transparent!important; } @media(max-width:900px){ .hnf-workspace-section-toolbar{ align-items:flex-start!important; } .hnf-workspace-section-toolbar>div{ width:auto!important; } .hnf-workspace-section-toolbar button{ min-height:34px!important; padding:7px 10px!important; } .hnf-workspace-collapsible>summary{ padding:11px 12px!important; } .hnf-workspace-collapsible-body{ padding:10px!important; } } /* v5.9.43 Sticky client workspace controls — CSS only */ .hnf-modal-card:has(.hnf-workspace-section-toolbar){ scroll-padding-top:92px!important; } /* Keep the client name visible while scrolling a long coaching workspace. */ .hnf-modal-card:has(.hnf-workspace-section-toolbar) #hnf-modal-title{ position:sticky!important; top:-24px!important; z-index:55!important; margin:-24px -24px 14px!important; padding:20px 58px 14px 24px!important; min-height:28px!important; background:rgba(17,17,24,.97)!important; border-bottom:1px solid #292933!important; backdrop-filter:blur(12px)!important; } /* Keep the close button available at the top-right while the workspace scrolls. */ .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-modal-close{ position:sticky!important; top:8px!important; z-index:60!important; float:right!important; margin:-8px 0 -38px auto!important; width:36px!important; height:36px!important; display:flex!important; align-items:center!important; justify-content:center!important; border-radius:999px!important; background:#202029!important; border:1px solid #343440!important; font-size:22px!important; line-height:1!important; } /* Expand / Collapse stays accessible once the profile summary scrolls away. */ .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ position:sticky!important; top:45px!important; z-index:45!important; margin:10px -6px 8px!important; padding:8px 6px!important; background:rgba(17,17,24,.96)!important; border-bottom:1px solid rgba(255,255,255,.06)!important; backdrop-filter:blur(10px)!important; } /* Give expanded sections a little visual focus. */ .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open]{ border-color:#3b3153!important; } .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open] > summary{ background:rgba(132,82,255,.055)!important; } @media(max-width:900px){ .hnf-modal-card:has(.hnf-workspace-section-toolbar) #hnf-modal-title{ top:-16px!important; margin:-16px -16px 12px!important; padding:16px 52px 12px 16px!important; font-size:18px!important; } .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-modal-close{ top:7px!important; margin:-5px 0 -35px auto!important; width:34px!important; height:34px!important; } .hnf-modal-card:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ top:42px!important; margin-left:-2px!important; margin-right:-2px!important; } } /* v5.9.44 Mobile client workspace full-screen polish — CSS only */ @media (max-width:900px){ /* When the coaching workspace modal is open, make it feel like a native app screen. */ .hnf-modal:has(.hnf-workspace-section-toolbar){ padding:0!important; align-items:stretch!important; justify-content:stretch!important; background:#0b0b10!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-card{ width:100vw!important; max-width:none!important; height:100dvh!important; max-height:100dvh!important; margin:0!important; border:0!important; border-radius:0!important; padding:16px 14px calc(86px + env(safe-area-inset-bottom))!important; box-sizing:border-box!important; overflow-y:auto!important; overflow-x:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) #hnf-modal-title{ top:-16px!important; margin:-16px -14px 12px!important; padding:16px 56px 13px 14px!important; min-height:28px!important; font-size:18px!important; line-height:1.2!important; border-bottom:1px solid #292933!important; background:rgba(17,17,24,.98)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-close{ position:sticky!important; top:8px!important; right:auto!important; margin:-4px 0 -36px auto!important; z-index:70!important; } /* Summary cards: 2 columns on phones, 3 columns in landscape/wider mobile. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary > div{ min-width:0!important; padding:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary b{ font-size:11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary span{ font-size:12px!important; overflow-wrap:anywhere!important; } /* Client actions and program assignment become a phone-friendly layout. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; align-items:stretch!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions > button{ width:100%!important; min-width:0!important; min-height:42px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign{ grid-column:1 / -1!important; display:grid!important; grid-template-columns:1fr 1fr!important; gap:8px!important; width:100%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign select{ grid-column:1 / -1!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign input, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign select, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign button{ width:100%!important; min-width:0!important; min-height:44px!important; } /* Sticky section controls remain compact on phone. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ top:42px!important; margin:8px -4px!important; padding:8px 4px!important; align-items:center!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar > span{ font-size:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar > div{ gap:5px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar button{ min-height:34px!important; padding:7px 9px!important; font-size:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible{ margin:7px 0!important; border-radius:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary{ min-height:48px!important; padding:10px 11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary strong{ font-size:13px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary span{ max-width:42%!important; font-size:9px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body{ padding:10px!important; } /* Full-width, thumb-friendly form controls inside opened sections. */ .hnf-modal:has(.hnf-workspace-section-toolbar) input, .hnf-modal:has(.hnf-workspace-section-toolbar) select, .hnf-modal:has(.hnf-workspace-section-toolbar) textarea{ min-height:44px!important; font-size:16px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) button, .hnf-modal:has(.hnf-workspace-section-toolbar) a.hnf-small-btn, .hnf-modal:has(.hnf-workspace-section-toolbar) a.hnf-whatsapp-btn{ touch-action:manipulation!important; } /* Bottom Close behaves like a safe-area action button on mobile. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-actions{ position:sticky!important; bottom:calc(-16px - env(safe-area-inset-bottom))!important; z-index:50!important; margin:16px -14px calc(-86px - env(safe-area-inset-bottom))!important; padding:10px 14px calc(14px + env(safe-area-inset-bottom))!important; background:linear-gradient(to top,#111118 72%,rgba(17,17,24,0))!important; border-top:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-actions button{ width:100%!important; min-height:46px!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions{ grid-template-columns:auto auto minmax(0,1fr)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign{ grid-column:auto!important; grid-template-columns:minmax(180px,1fr) 150px auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign select{ grid-column:auto!important; } } /* v5.9.45 Mobile client progress & photos polish — CSS only */ @media (max-width:900px){ /* Progress metric cards */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards > div{ min-width:0!important; padding:11px!important; border-radius:11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards span{ font-size:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards strong{ font-size:17px!important; line-height:1.15!important; } /* Trend cards stack cleanly on portrait phones. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends-three{ display:grid!important; grid-template-columns:1fr!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel{ min-width:0!important; padding:11px!important; border-radius:12px!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel h4{ font-size:13px!important; margin:0 0 8px!important; } /* Keep trend SVGs readable without horizontal overflow. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel svg{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:120px!important; } /* First-vs-latest table scrolls inside its own card. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-compare-table{ width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch!important; border-radius:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-compare-row{ min-width:520px!important; } /* Before vs latest photos: stack on portrait, preserving large usable images. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ display:grid!important; grid-template-columns:1fr!important; gap:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figure{ margin:0!important; min-width:0!important; overflow:hidden!important; border-radius:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare img{ display:block!important; width:100%!important; height:auto!important; max-height:68vh!important; object-fit:contain!important; background:#0b0b0f!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption{ display:flex!important; justify-content:space-between!important; gap:10px!important; align-items:flex-start!important; padding:9px 10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption strong{ font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption span{ font-size:9px!important; text-align:right!important; } /* Gallery uses compact square thumbnails. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-admin-photo-grid{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery a{ min-width:0!important; text-decoration:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery img{ width:100%!important; aspect-ratio:1/1!important; height:auto!important; object-fit:cover!important; border-radius:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery span{ display:block!important; margin-top:4px!important; color:#8e8e9a!important; font-size:8px!important; line-height:1.25!important; overflow-wrap:anywhere!important; } /* Check-in rows easier to scan on mobile. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item{ padding:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item strong{ font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item span, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item small{ font-size:10px!important; line-height:1.4!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards{ grid-template-columns:repeat(4,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends-three{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-admin-photo-grid{ grid-template-columns:repeat(5,minmax(0,1fr))!important; } } /* v5.9.46 Mobile Trainer Feedback + Workout Results polish — CSS only */ @media (max-width:900px){ /* Trainer feedback compose area */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-feedback-panel{ min-width:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-head-actions{ width:100%!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; flex-wrap:wrap!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-compose{ display:flex!important; flex-direction:column!important; gap:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) #hnf-feedback-message{ width:100%!important; min-height:110px!important; resize:vertical!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions{ display:grid!important; grid-template-columns:1fr!important; gap:8px!important; width:100%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions select, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions button{ width:100%!important; min-width:0!important; min-height:44px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-history{ display:flex!important; flex-direction:column!important; gap:8px!important; margin-top:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-item{ border:1px solid #292933!important; border-radius:11px!important; background:#101016!important; padding:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-meta{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; flex-wrap:wrap!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-meta strong{ font-size:11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-meta span, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-meta b{ font-size:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-item p{ margin:8px 0 0!important; font-size:11px!important; line-height:1.5!important; overflow-wrap:anywhere!important; } /* Workout result cards */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results{ display:flex!important; flex-direction:column!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results > details{ border:1px solid #292933!important; border-radius:12px!important; background:#101016!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results > details > summary{ min-height:52px!important; padding:10px 11px!important; cursor:pointer!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-workout-result-head, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-session-result-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:9px!important; flex-wrap:wrap!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results strong{ font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results span, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results small{ font-size:9px!important; line-height:1.35!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results table{ width:100%!important; min-width:560px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-table-wrap, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-result-table-wrap{ width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-context-wa-row{ display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:6px!important; margin-top:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-context-wa-row button{ width:100%!important; min-height:42px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-results .hnf-context-wa-row span{ text-align:left!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions{ grid-template-columns:minmax(0,1fr) auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions button{ min-width:140px!important; } } /* v5.9.47 Mobile workout result review polish — CSS only */ @media (max-width:900px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result{ border:1px solid #2b2b35!important; border-radius:13px!important; background:#101016!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result > summary{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:10px!important; padding:11px!important; min-height:54px!important; cursor:pointer!important; list-style:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result > summary::-webkit-details-marker{ display:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result > summary > div:first-child{ min-width:0!important; flex:1 1 auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result > summary strong{ display:block!important; font-size:13px!important; line-height:1.25!important; margin-bottom:3px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result > summary span{ display:block!important; font-size:9px!important; line-height:1.35!important; color:#8f8f9d!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result-summary{ flex:0 0 auto!important; display:flex!important; flex-direction:column!important; align-items:flex-end!important; gap:4px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result-summary span{ padding:4px 6px!important; border-radius:999px!important; background:#1c1c25!important; border:1px solid #343440!important; color:#c9c9d2!important; font-size:8px!important; white-space:nowrap!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-result-body{ padding:10px!important; border-top:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-exercise-result{ border:1px solid #292933!important; border-radius:11px!important; background:#14141b!important; padding:10px!important; margin-bottom:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-exercise-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:8px!important; margin-bottom:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-exercise-head strong{ font-size:12px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-exercise-head span{ font-size:9px!important; line-height:1.35!important; text-align:right!important; color:#8f8f9d!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-table{ border:1px solid #292933!important; border-radius:9px!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-row{ display:grid!important; grid-template-columns:50px 1fr 1fr 80px!important; gap:6px!important; align-items:center!important; min-width:0!important; padding:8px!important; border-top:1px solid #25252e!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-row:first-child{ border-top:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-head{ background:#1a1a22!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-row span{ font-size:9px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-head span{ color:#aaaab6!important; font-weight:700!important; text-transform:uppercase!important; letter-spacing:.03em!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-note{ margin-top:10px!important; padding:10px!important; border:1px solid #3a3151!important; border-radius:10px!important; background:rgba(132,82,255,.06)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-note b{ display:block!important; font-size:10px!important; margin-bottom:4px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-note p{ margin:0!important; font-size:10px!important; line-height:1.45!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-meta{ display:flex!important; flex-wrap:wrap!important; gap:6px!important; margin-top:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-meta span{ padding:5px 7px!important; border-radius:8px!important; background:#17171f!important; border:1px solid #292933!important; color:#9494a0!important; font-size:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-context-wa-workout{ margin-top:10px!important; padding-top:10px!important; border-top:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-context-wa-workout button{ min-height:44px!important; width:100%!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-set-row{ grid-template-columns:70px 1fr 1fr 110px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-exercise-head{ align-items:center!important; } } /* v5.9.48 Mobile coaching workspace navigation polish — CSS only */ @media (max-width:900px){ /* Keep the workspace title/close control easy to reach while reviewing long client records. */ .hnf-modal:has(.hnf-workspace-section-toolbar) > .hnf-modal-head, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-head:first-child{ position:sticky!important; top:0!important; z-index:72!important; margin:-14px -14px 0!important; padding:12px 14px!important; min-height:48px!important; background:rgba(17,17,24,.98)!important; backdrop-filter:blur(10px)!important; border-bottom:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-head h3{ min-width:0!important; max-width:calc(100% - 48px)!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; font-size:15px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-head button{ min-width:38px!important; width:38px!important; min-height:38px!important; height:38px!important; padding:0!important; border-radius:50%!important; } /* The section toolbar sits immediately below the sticky title. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ top:48px!important; z-index:70!important; margin:0 -14px 8px!important; padding:8px 14px!important; background:rgba(17,17,24,.98)!important; backdrop-filter:blur(10px)!important; border-bottom:1px solid #292933!important; } /* Larger, clearer section rows without changing their existing click behavior. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary{ min-height:52px!important; padding:11px 12px!important; touch-action:manipulation!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open] > summary{ background:rgba(132,82,255,.08)!important; border-bottom:1px solid rgba(132,82,255,.20)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open]{ border-color:#3a3151!important; box-shadow:0 0 0 1px rgba(132,82,255,.05)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary strong{ font-size:13px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary span{ max-width:46%!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; } /* Preserve space for the app bottom navigation and safe area. */ .hnf-modal:has(.hnf-workspace-section-toolbar){ scroll-padding-top:108px!important; padding-bottom:calc(86px + env(safe-area-inset-bottom))!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) > .hnf-modal-head, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-modal-head:first-child{ min-height:44px!important; padding-top:8px!important; padding-bottom:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ top:44px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary{ min-height:46px!important; padding-top:8px!important; padding-bottom:8px!important; } } /* v5.9.49 Mobile coaching assignment controls polish — CSS only */ @media (max-width:900px){ /* Quick workout assignment becomes a clear thumb-friendly workflow. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-panel{ padding:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:8px!important; width:100%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form select, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form input[type="text"]{ grid-column:1 / -1!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form input[type="date"], .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form button{ width:100%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form button{ min-height:46px!important; font-weight:800!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-list{ margin-top:12px!important; display:grid!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-list > *{ min-width:0!important; border-radius:10px!important; } /* Training-plan content stays readable and actions do not crush together. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-workspace{ display:grid!important; gap:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-workspace .hnf-row-actions, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-workspace .hnf-workspace-actions{ display:flex!important; flex-wrap:wrap!important; gap:6px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-workspace button{ min-height:40px!important; } /* Program assignment at the top reads as one grouped action. */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign{ padding:9px!important; border:1px solid #2c2c36!important; border-radius:11px!important; background:#14141b!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) #hnf-client-assign-program{ font-weight:800!important; } } @media (max-width:560px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form{ grid-template-columns:1fr!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form select, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form input, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form button{ grid-column:1!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form{ grid-template-columns:minmax(180px,1fr) 150px minmax(180px,1fr) auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form select, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assign-form input[type="text"]{ grid-column:auto!important; } } /* v5.9.50 Mobile Training Plan polish — CSS only */ @media (max-width:900px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-card{ border:1px solid #2b2b35!important; border-radius:13px!important; background:#101016!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head{ display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:10px!important; padding:11px!important; border-bottom:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head > div:first-child{ min-width:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head strong{ display:block!important; font-size:14px!important; line-height:1.25!important; margin-bottom:4px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head span{ display:block!important; color:#8f8f9d!important; font-size:10px!important; line-height:1.4!important; overflow-wrap:anywhere!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head .hnf-row-actions{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:7px!important; width:100%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head .hnf-row-actions > *{ width:100%!important; min-width:0!important; min-height:40px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-list{ display:flex!important; flex-direction:column!important; gap:7px!important; padding:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout{ border:1px solid #292933!important; border-radius:11px!important; background:#14141b!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout > summary{ display:flex!important; flex-direction:column!important; align-items:flex-start!important; gap:4px!important; cursor:pointer!important; list-style:none!important; padding:10px 11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout > summary::-webkit-details-marker{ display:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout > summary span{ color:#a889ff!important; font-size:9px!important; line-height:1.2!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout > summary strong{ color:#f2f2f5!important; font-size:13px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout[open] > summary{ border-bottom:1px solid #292933!important; background:rgba(132,82,255,.05)!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workout-manage-body{ padding:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise{ display:flex!important; flex-direction:column!important; gap:8px!important; padding:10px 0!important; border-top:1px solid #25252e!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise:first-child{ border-top:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise b{ display:block!important; font-size:12px!important; line-height:1.25!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise span, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise small{ display:block!important; font-size:10px!important; line-height:1.4!important; color:#8f8f9d!important; margin-top:2px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise button, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-add-exercise{ width:100%!important; min-height:40px!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-manage-head .hnf-row-actions{ width:auto!important; grid-template-columns:auto auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-week-workout > summary{ flex-direction:row!important; justify-content:space-between!important; align-items:center!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-program-exercise button{ width:auto!important; min-width:130px!important; } } /* v5.9.51 Mobile Workout Results polish — CSS only */ @media (max-width:900px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card{ border-radius:12px!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card > summary, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card > summary{ min-height:58px!important; padding:11px 12px!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card table, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card table{ width:100%!important; table-layout:fixed!important; font-size:11px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card th, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card td, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card th, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card td{ padding:9px 7px!important; overflow-wrap:anywhere!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card th:first-child, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card td:first-child, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card th:first-child, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card td:first-child{ width:12%!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card .hnf-whatsapp, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card .hnf-whatsapp, .hnf-modal:has(.hnf-workspace-section-toolbar) a[href*="wa.me"]{ min-height:40px!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-meta{ display:flex!important; flex-wrap:wrap!important; gap:6px!important; font-size:10px!important; line-height:1.4!important; } } @media (max-width:520px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card th, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-session-card td, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card th, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workout-result-card td{ font-size:10px!important; padding:8px 5px!important; } } /* v5.9.52 Mobile Trainer Feedback polish — CSS only */ @media (max-width:900px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-card, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-feedback, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-panel{ border-radius:12px!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) textarea{ width:100%!important; min-height:96px!important; box-sizing:border-box!important; resize:vertical!important; font-size:13px!important; line-height:1.45!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) select{ min-height:42px!important; font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-compose-actions{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; gap:8px!important; align-items:stretch!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions button, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-compose-actions button{ min-height:42px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-message, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-message-card{ padding:11px!important; border-radius:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-message p, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-message-card p{ margin:7px 0 0!important; line-height:1.45!important; overflow-wrap:anywhere!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) a[href*="wa.me"]{ min-height:42px!important; } } @media (max-width:520px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-compose-actions{ grid-template-columns:1fr!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-actions > *, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-feedback-compose-actions > *{ width:100%!important; min-width:0!important; } } /* v5.9.53 Mobile Goals & Targets polish — CSS only */ @media (max-width:900px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-dashboard{ gap:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-dashboard > .hnf-panel-head, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-dashboard > header{ align-items:flex-start!important; gap:10px!important; flex-wrap:wrap!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-overview{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-deadline, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-metric{ min-width:0!important; padding:11px!important; border-radius:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-deadline strong, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-metric strong{ font-size:18px!important; overflow-wrap:anywhere!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-list{ grid-template-columns:1fr!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card{ padding:11px!important; border-radius:10px!important; min-width:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head{ gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head > div{ min-width:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head strong{ font-size:16px!important; line-height:1.3!important; overflow-wrap:anywhere!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head b{ flex:0 0 auto!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-progress-track{ margin:10px 0 7px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-foot{ gap:8px!important; font-size:11px!important; flex-wrap:wrap!important; } } @media (max-width:520px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-overview{ grid-template-columns:1fr 1fr!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head{ align-items:flex-start!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-foot{ flex-direction:row!important; justify-content:space-between!important; } } @media (max-width:390px){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-overview{ grid-template-columns:1fr!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-head, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-goal-card-foot{ flex-direction:column!important; } } /* v5.9.54 Mobile Client Progress refinement — CSS only */ @media (max-width:900px){ /* Progress section heading and count */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-workspace-section-head{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-workspace-section-head h3{ margin:0!important; font-size:17px!important; line-height:1.2!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-workspace-section-head p{ margin:4px 0 0!important; font-size:11px!important; line-height:1.4!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-count{ flex:0 0 auto!important; min-height:32px!important; display:inline-flex!important; align-items:center!important; padding:6px 9px!important; border-radius:999px!important; background:#1c1c25!important; border:1px solid #33333f!important; font-size:10px!important; white-space:nowrap!important; } /* Latest measurement cards */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; margin-top:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards > div{ min-width:0!important; padding:11px!important; border:1px solid #2d2d37!important; border-radius:11px!important; background:#14141b!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards span{ display:block!important; color:#8f8f9d!important; font-size:9px!important; text-transform:uppercase!important; letter-spacing:.04em!important; margin-bottom:5px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards strong{ display:block!important; font-size:17px!important; line-height:1.15!important; color:#f5f5f7!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards small{ display:block!important; margin-top:4px!important; color:#888895!important; font-size:9px!important; } /* Latest check-in WhatsApp action */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard > .hnf-context-wa-row{ display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:6px!important; margin:10px 0!important; padding:9px!important; border:1px solid #292933!important; border-radius:10px!important; background:#101016!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard > .hnf-context-wa-row button{ width:100%!important; min-height:43px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard > .hnf-context-wa-row span{ font-size:9px!important; line-height:1.35!important; color:#888895!important; } /* Trend cards */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends-three{ display:grid!important; grid-template-columns:1fr!important; gap:8px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel{ border:1px solid #2b2b35!important; border-radius:11px!important; background:#121219!important; padding:10px!important; min-width:0!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel h4{ margin:0 0 7px!important; font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-panel svg{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:120px!important; } /* First vs latest comparison stays contained */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-compare-table{ width:100%!important; max-width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch!important; border-radius:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-compare-row{ min-width:520px!important; } /* Check-in history */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history{ padding:0!important; overflow:hidden!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; padding:11px!important; cursor:pointer!important; list-style:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary::-webkit-details-marker{ display:none!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history[open] > summary{ border-bottom:1px solid #292933!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-admin-list{ display:flex!important; flex-direction:column!important; gap:7px!important; padding:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item{ border:1px solid #292933!important; border-radius:9px!important; background:#101016!important; padding:9px!important; } /* Progress photo comparison & gallery */ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ display:grid!important; grid-template-columns:1fr!important; gap:9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figure{ margin:0!important; min-width:0!important; overflow:hidden!important; border-radius:10px!important; border:1px solid #2b2b35!important; background:#0d0d12!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare img{ display:block!important; width:100%!important; height:auto!important; max-height:66vh!important; object-fit:contain!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:8px!important; padding:8px 9px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:7px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery img{ width:100%!important; aspect-ratio:1/1!important; object-fit:cover!important; border-radius:8px!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-cards{ grid-template-columns:repeat(4,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends, .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-trends-three{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-progress-gallery{ grid-template-columns:repeat(5,minmax(0,1fr))!important; } } /* v5.9.55 Portrait progress-photo comparison refinement — CSS only */ @media (max-width:900px) and (orientation:portrait){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ display:grid!important; grid-template-columns:1fr!important; gap:10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figure{ width:100%!important; max-width:none!important; margin:0!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare img{ width:100%!important; max-width:100%!important; height:auto!important; max-height:none!important; object-fit:contain!important; background:#0b0b10!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption{ padding:9px 10px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption strong{ font-size:12px!important; } .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare figcaption span{ font-size:9px!important; } } @media (max-width:900px) and (orientation:landscape){ .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-photo-compare{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } } /* v5.9.56 Force portrait Before/Latest stacking */ @media (max-width:900px) and (orientation:portrait){ html body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare{ display:flex!important; flex-direction:column!important; align-items:stretch!important; justify-content:flex-start!important; grid-template-columns:none!important; gap:12px!important; width:100%!important; } html body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare > figure{ display:block!important; flex:0 0 auto!important; width:100%!important; max-width:100%!important; min-width:0!important; margin:0!important; box-sizing:border-box!important; } html body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare > figure > img{ display:block!important; width:100%!important; max-width:100%!important; min-width:0!important; height:auto!important; max-height:none!important; aspect-ratio:auto!important; object-fit:contain!important; box-sizing:border-box!important; } html body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare > figure > figcaption{ width:100%!important; box-sizing:border-box!important; } } /* Keep landscape explicitly side-by-side. */ @media (max-width:900px) and (orientation:landscape){ html body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } } /* v5.9.57 — use the app's proven trainer-phone mode instead of orientation detection */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare{ display:flex!important; flex-flow:column nowrap!important; grid-template-columns:none!important; align-items:stretch!important; width:100%!important; gap:12px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare > figure{ flex:none!important; display:block!important; width:100%!important; max-width:100%!important; min-width:0!important; margin:0!important; box-sizing:border-box!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare > figure > img{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; max-height:none!important; object-fit:contain!important; } /* On genuinely wide phone landscape, restore the two-up comparison. */ @media (min-width:700px) and (min-aspect-ratio:4/3){ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-progress-dashboard .hnf-photo-compare{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; } } /* v5.9.58 Mobile Check-in History polish — CSS only */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history{ border:1px solid #2b2b35!important; border-radius:11px!important; background:#121219!important; overflow:hidden!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; min-height:46px!important; padding:10px 11px!important; cursor:pointer!important; list-style:none!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary::-webkit-details-marker{ display:none!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary strong{ font-size:12px!important; line-height:1.2!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history > summary span{ flex:0 0 auto!important; color:#a889ff!important; font-size:9px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history[open] > summary{ border-bottom:1px solid #292933!important; background:rgba(132,82,255,.045)!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history .hnf-client-admin-list{ display:flex!important; flex-direction:column!important; gap:8px!important; padding:9px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item{ border:1px solid #292933!important; border-radius:10px!important; background:#101016!important; padding:10px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item strong{ display:block!important; font-size:12px!important; line-height:1.25!important; margin-bottom:5px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item span{ display:block!important; font-size:10px!important; line-height:1.45!important; color:#d1d1d8!important; overflow-wrap:anywhere!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-trainer-checkin-item small{ display:block!important; margin-top:5px!important; font-size:9px!important; line-height:1.45!important; color:#8f8f9d!important; overflow-wrap:anywhere!important; } @media (min-width:700px) and (min-aspect-ratio:4/3){ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-checkin-history .hnf-client-admin-list{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; } } /* v5.9.59 Compact mobile coaching workspace header — CSS only */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; margin-bottom:8px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary > div{ min-width:0!important; padding:8px 9px!important; border-radius:9px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary b{ font-size:9px!important; line-height:1.2!important; margin-bottom:3px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary span{ font-size:11px!important; line-height:1.3!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions{ display:flex!important; flex-wrap:wrap!important; align-items:center!important; gap:6px!important; margin-bottom:6px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions > button{ min-height:34px!important; width:auto!important; padding:7px 9px!important; font-size:10px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-workspace-actions > .hnf-muted{ flex:1 1 180px!important; min-width:0!important; font-size:10px!important; line-height:1.3!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign{ flex:1 1 100%!important; display:grid!important; grid-template-columns:minmax(0,1fr) 132px auto!important; gap:6px!important; padding:7px!important; margin-top:2px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign select, html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign input, html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign button{ min-height:38px!important; font-size:11px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar{ margin:4px -3px 6px!important; padding:6px 3px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar > span{ font-size:8px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-section-toolbar button{ min-height:32px!important; padding:6px 8px!important; font-size:9px!important; } @media (max-width:560px){ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-client-profile-summary{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-inline-assign{ grid-template-columns:1fr!important; } } /* v5.9.60 Compact app-style mobile workspace sections — CSS only */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible{ margin:6px 0!important; border:1px solid #292933!important; border-radius:11px!important; background:#111117!important; overflow:hidden!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary{ display:grid!important; grid-template-columns:minmax(0,1fr) auto 18px!important; align-items:center!important; gap:8px!important; min-height:44px!important; padding:9px 11px!important; cursor:pointer!important; list-style:none!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary::-webkit-details-marker{ display:none!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary strong{ font-size:12px!important; line-height:1.2!important; color:#f1f1f4!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary span{ max-width:150px!important; font-size:9px!important; line-height:1.2!important; color:#888895!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; text-align:right!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary::after{ content:'›'!important; position:static!important; display:flex!important; align-items:center!important; justify-content:center!important; width:18px!important; height:18px!important; color:#9b6cff!important; font-size:18px!important; line-height:1!important; transform:rotate(90deg)!important; transition:transform .16s ease!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open] > summary::after{ transform:rotate(-90deg)!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible[open] > summary{ background:rgba(132,82,255,.055)!important; border-bottom:1px solid #292933!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body{ padding:9px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body > section, html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body > div{ margin-top:0!important; margin-bottom:0!important; } /* Make repeated section titles inside an open accordion less bulky. */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body .hnf-workspace-section-head{ margin-bottom:8px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body .hnf-workspace-section-head h3, html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body .hnf-workspace-section-head h4{ font-size:14px!important; line-height:1.2!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body .hnf-workspace-section-head p{ font-size:10px!important; line-height:1.35!important; margin-top:3px!important; } /* Compact vertical rhythm inside open workspace sections. */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible-body > * + *{ margin-top:8px!important; } @media (max-width:560px){ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary{ grid-template-columns:minmax(0,1fr) 18px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-workspace-collapsible > summary span{ display:none!important; } } /* v5.9.61 Mobile quick-assignment cards — CSS only */ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-list{ display:flex!important; flex-direction:column!important; gap:7px!important; margin-top:10px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row{ display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center!important; gap:10px!important; padding:10px!important; border:1px solid #292933!important; border-radius:10px!important; background:#101016!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row > div:first-child{ min-width:0!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row strong{ display:block!important; font-size:12px!important; line-height:1.25!important; color:#f4f4f6!important; margin-bottom:3px!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row span{ display:block!important; font-size:9px!important; line-height:1.35!important; color:#8f8f9d!important; overflow-wrap:anywhere!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row .hnf-row-actions{ display:flex!important; align-items:center!important; justify-content:flex-end!important; gap:6px!important; flex-wrap:nowrap!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-status{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:26px!important; padding:4px 7px!important; border-radius:999px!important; background:#1c1c25!important; border:1px solid #343440!important; color:#b6b6c1!important; font-size:8px!important; font-weight:700!important; text-transform:uppercase!important; letter-spacing:.03em!important; white-space:nowrap!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-cancel-quick-workout{ min-height:32px!important; padding:6px 9px!important; white-space:nowrap!important; } @media (max-width:560px){ html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row{ grid-template-columns:1fr!important; } html.hnf-trainer-phone body #hnf-trainer-dashboard .hnf-modal:has(.hnf-workspace-section-toolbar) .hnf-quick-assignment-row .hnf-row-actions{ justify-content:space-between!important; width:100%!important; } } /* v5.9.62 Workout Builder */ .hnf-workout-builder{display:grid;gap:12px} .hnf-builder-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px} .hnf-builder-toolbar strong{display:block;font-size:17px} .hnf-builder-toolbar span{display:block;margin-top:3px;color:#8f8f9d;font-size:11px} .hnf-workout-builder-preview{ border:1px solid #2b2b35; border-radius:12px; overflow:hidden; background:#101016; } .hnf-workout-builder-preview>summary{ cursor:pointer; padding:11px 12px; font-weight:700; list-style:none; } .hnf-workout-builder-preview>summary::-webkit-details-marker{display:none} .hnf-workout-builder-preview>div{padding:9px;border-top:1px solid #292933} .hnf-builder-preview-row{ display:grid;grid-template-columns:28px minmax(0,1fr) auto; gap:10px;align-items:center;padding:9px 4px;border-top:1px solid #25252e } .hnf-builder-preview-row:first-child{border-top:0} .hnf-builder-preview-row>span{ width:26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center; background:#1d1d26;font-size:10px } .hnf-builder-preview-row strong,.hnf-builder-preview-row small,.hnf-builder-preview-row em{display:block} .hnf-builder-preview-row small{color:#90909d;font-size:10px;margin-top:2px} .hnf-builder-preview-row em{color:#aaaab5;font-size:10px;font-style:normal;margin-top:3px} .hnf-builder-preview-row>b{ font-size:9px;color:#cdbdff;background:#2a2044;border:1px solid #4d3b78;border-radius:999px;padding:5px 7px } .hnf-builder-list{display:grid;gap:8px} .hnf-builder-exercise-card{ display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:center; border:1px solid #2b2b35;border-radius:12px;background:#14141b;padding:10px } .hnf-builder-exercise-card.is-dragging{opacity:.45} .hnf-builder-drag{ border:0!important;background:#1d1d26!important;color:#9999a7!important;border-radius:8px!important; width:30px!important;height:40px!important;padding:0!important;cursor:grab!important;font-size:18px!important } .hnf-builder-exercise-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap} .hnf-builder-exercise-copy strong{font-size:13px} .hnf-builder-exercise-copy>span{display:block;color:#90909d;font-size:10px;margin-top:4px} .hnf-builder-exercise-copy>small{display:block;color:#b5b5bf;font-size:10px;margin-top:3px} .hnf-builder-ss-badge{ font-size:8px;color:#cdbdff;background:#2a2044;border:1px solid #4d3b78;border-radius:999px;padding:4px 6px } .hnf-builder-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end} .hnf-builder-actions .hnf-small-btn{min-height:34px} .hnf-builder-add-card{ border:1px solid #3a3151;border-radius:13px;background:rgba(132,82,255,.045);padding:12px } .hnf-builder-add-head{margin-bottom:9px} .hnf-builder-add-head strong,.hnf-builder-add-head span{display:block} .hnf-builder-add-head strong{font-size:14px} .hnf-builder-add-head span{font-size:10px;color:#8f8f9d;margin-top:2px} .hnf-builder-fields{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:8px 0} .hnf-builder-rest-presets{display:flex;gap:4px;margin-top:5px} .hnf-builder-rest-preset{min-height:28px!important;padding:4px 6px!important;font-size:9px!important} .hnf-builder-check{display:flex!important;align-items:center;gap:7px!important;margin:9px 0!important;font-size:11px!important} .hnf-builder-check input{width:auto!important;min-height:0!important} .hnf-builder-add-button{width:100%!important;min-height:44px!important} @media(max-width:900px){ .hnf-builder-toolbar{align-items:flex-start} .hnf-builder-exercise-card{grid-template-columns:30px minmax(0,1fr)} .hnf-builder-actions{ grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100% } .hnf-builder-actions>*{width:100%!important} .hnf-builder-fields{grid-template-columns:repeat(2,minmax(0,1fr))} .hnf-builder-rest-field{grid-column:1/-1} .hnf-builder-preview-row{grid-template-columns:26px minmax(0,1fr)} .hnf-builder-preview-row>b{grid-column:2} } @media(max-width:520px){ .hnf-builder-fields{grid-template-columns:1fr} .hnf-builder-rest-field{grid-column:1} .hnf-builder-actions{grid-template-columns:repeat(2,minmax(0,1fr))} } /* v5.9.63 Compact Workout Builder add panel */ .hnf-builder-add-card{ border:1px solid #3a3151!important; border-radius:13px!important; background:rgba(132,82,255,.045)!important; padding:0!important; overflow:hidden!important; } .hnf-builder-add-card > summary{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; cursor:pointer!important; list-style:none!important; padding:12px!important; user-select:none!important; -webkit-user-select:none!important; } .hnf-builder-add-card > summary::-webkit-details-marker{ display:none!important; } .hnf-builder-add-card > summary span{ min-width:0!important; } .hnf-builder-add-card > summary strong, .hnf-builder-add-card > summary small{ display:block!important; } .hnf-builder-add-card > summary strong{ font-size:14px!important; line-height:1.2!important; color:#f5f5f7!important; } .hnf-builder-add-card > summary small{ margin-top:3px!important; font-size:10px!important; line-height:1.35!important; color:#8f8f9d!important; } .hnf-builder-add-card > summary b{ flex:0 0 auto!important; color:#a889ff!important; font-size:18px!important; line-height:1!important; transform:rotate(0deg)!important; transition:transform .16s ease!important; } .hnf-builder-add-card[open] > summary{ border-bottom:1px solid #3a3151!important; background:rgba(132,82,255,.055)!important; } .hnf-builder-add-card[open] > summary b{ transform:rotate(180deg)!important; } .hnf-builder-add-body{ padding:12px!important; } .hnf-workout-builder .hnf-builder-toolbar{ position:sticky!important; top:0!important; z-index:8!important; padding:8px 0!important; background:rgba(17,17,24,.96)!important; backdrop-filter:blur(10px)!important; } @media(max-width:900px){ .hnf-builder-add-card > summary{ padding:11px!important; } .hnf-builder-add-body{ padding:10px!important; } .hnf-workout-builder .hnf-builder-toolbar{ top:-1px!important; } } /* v5.9.66 dedicated mobile workout detail screen */ .hnf-mobile-workout-detail[hidden]{display:none!important} @media(max-width:900px){ #hnf-client-view-workouts .hnf-desktop-workout-head, #hnf-client-view-workouts > #hnf-client-workouts{ display:none!important; } .hnf-mobile-workout-detail{ display:block!important; width:100%!important; padding:0 0 calc(88px + env(safe-area-inset-bottom))!important; } .hnf-mobile-workout-detail-head{ position:sticky!important; top:0!important; z-index:20!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important; padding:10px 0!important; background:rgba(10,10,14,.96)!important; backdrop-filter:blur(12px)!important; } .hnf-mobile-workout-detail-head button{ min-height:42px!important; padding:8px 12px!important; border-radius:10px!important; } .hnf-mobile-workout-detail-head span{ color:#8f8f9d!important; font-size:9px!important; font-weight:800!important; letter-spacing:.08em!important; } .hnf-mobile-workout-detail .hnf-client-workout-card{ margin:0!important; padding:12px!important; border-radius:15px!important; } .hnf-mobile-workout-detail .hnf-client-workout-card .hnf-workout-title{ display:block!important; } .hnf-mobile-workout-detail .hnf-client-workout-card .hnf-row-actions{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:8px!important; width:100%!important; margin-top:10px!important; } .hnf-mobile-workout-detail .hnf-client-workout-card .hnf-row-actions button{ width:100%!important; min-height:44px!important; } .hnf-mobile-workout-detail .hnf-client-exercise{ border:1px solid #2d2937!important; border-radius:13px!important; background:#14131a!important; } .hnf-mobile-workout-detail .hnf-set-logger{ overflow:hidden!important; border:1px solid #2b2833!important; border-radius:11px!important; } .hnf-mobile-workout-detail .hnf-set-head, .hnf-mobile-workout-detail .hnf-set-row{ grid-template-columns:34px minmax(70px,1fr) minmax(62px,.8fr) 58px!important; gap:6px!important; } .hnf-mobile-workout-detail .hnf-set-row input{ width:100%!important; min-width:0!important; min-height:42px!important; } .hnf-mobile-workout-detail .hnf-save-set{ min-height:42px!important; padding:7px!important; } } /* v5.9.67 Client superset presentation + metadata cleanup */ .hnf-client-exercise-head{ display:flex!important; align-items:center!important; gap:7px!important; flex-wrap:wrap!important; } .hnf-client-superset-badge{ display:inline-flex!important; align-items:center!important; min-height:22px!important; padding:3px 7px!important; border-radius:999px!important; border:1px solid #4d3b78!important; background:#2a2044!important; color:#cfbfff!important; font-size:9px!important; font-weight:800!important; line-height:1!important; white-space:nowrap!important; } @media(max-width:900px){ .hnf-client-superset-badge{ min-height:21px!important; padding:3px 6px!important; font-size:8px!important; } } /* v5.9.68 Client superset A1/A2 visual grouping */ .hnf-client-superset-badge{ justify-content:center!important; min-width:27px!important; padding:3px 7px!important; background:#5b2bbd!important; border-color:#8b5cf6!important; color:#fff!important; font-size:10px!important; letter-spacing:.02em!important; } .hnf-client-exercise.hnf-client-superset-item{ position:relative!important; border-left:3px solid #8b5cf6!important; } .hnf-client-exercise.hnf-client-superset-item::before{ content:''; position:absolute; left:-3px; top:-10px; width:3px; height:10px; background:#8b5cf6; } .hnf-client-exercise.hnf-client-superset-item.is-superset-first::before{ display:none; } .hnf-client-exercise.hnf-client-superset-item.is-superset-first{ box-shadow:inset 3px 0 0 rgba(139,92,246,.12)!important; } .hnf-client-exercise.hnf-client-superset-item.is-superset-last{ margin-bottom:18px!important; } @media(max-width:900px){ .hnf-client-superset-badge{ min-width:26px!important; min-height:22px!important; font-size:9px!important; } .hnf-mobile-workout-detail .hnf-client-exercise.hnf-client-superset-item{ border-left:3px solid #8b5cf6!important; } } /* v5.9.69 Guided superset workout flow */ .hnf-client-exercise.hnf-client-superset-item.is-superset-next{border-color:#a978ff!important;box-shadow:inset 3px 0 0 rgba(139,92,246,.18),0 0 0 1px rgba(139,92,246,.18)!important} .hnf-client-superset-next-label{display:inline-flex!important;align-items:center!important;min-height:22px!important;padding:3px 8px!important;border-radius:999px!important;background:rgba(139,92,246,.14)!important;border:1px solid rgba(169,120,255,.5)!important;color:#d8c7ff!important;font-size:9px!important;font-weight:800!important;letter-spacing:.05em!important;white-space:nowrap!important} .hnf-set-row.is-superset-next-set{outline:1px solid rgba(169,120,255,.65)!important;outline-offset:-1px!important;background:rgba(139,92,246,.08)!important} .hnf-set-row.is-superset-next-set .hnf-save-set:not(.is-done){box-shadow:0 0 0 2px rgba(139,92,246,.22)!important} @media(max-width:900px){.hnf-client-superset-next-label{font-size:8px!important;padding:3px 6px!important}} /* v5.9.70 Guided Superset Flow correction */ .hnf-superset-next-banner{ display:grid!important; grid-template-columns:auto minmax(0,1fr) auto!important; align-items:center!important; gap:8px!important; margin:8px 0 7px!important; padding:9px 11px!important; border:1px solid rgba(139,92,246,.5)!important; border-radius:11px!important; background:linear-gradient(90deg,rgba(124,58,237,.16),rgba(124,58,237,.05))!important; } .hnf-superset-next-banner>span{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:24px!important; padding:4px 7px!important; border-radius:999px!important; background:#7c3aed!important; color:#fff!important; font-size:8px!important; font-weight:900!important; letter-spacing:.08em!important; } .hnf-superset-next-banner>strong{font-size:12px!important;color:#f2ebff!important} .hnf-superset-next-banner>small{font-size:9px!important;color:#a89eb9!important;white-space:nowrap!important} .hnf-client-superset-next-label{ background:#7c3aed!important; color:#fff!important; border-color:#9b72ff!important; } .hnf-set-row.is-superset-next-set{ outline:2px solid rgba(139,92,246,.78)!important; outline-offset:-2px!important; background:rgba(124,58,237,.11)!important; } .hnf-set-row.is-superset-next-set>span:first-child::after{ content:'NEXT'!important; display:block!important; margin-top:2px!important; color:#b99cff!important; font-size:7px!important; font-weight:900!important; letter-spacing:.05em!important; } @media(max-width:560px){ .hnf-superset-next-banner{grid-template-columns:auto 1fr!important} .hnf-superset-next-banner>small{grid-column:2!important} } /* v5.9.71 Live workout progress */ .hnf-live-workout-progress{ display:grid!important; gap:8px!important; margin:12px 0 15px!important; padding:11px 12px!important; border:1px solid #332c44!important; border-radius:12px!important; background:linear-gradient(135deg,rgba(124,58,237,.10),rgba(18,17,24,.92))!important; } .hnf-live-workout-progress-copy{ display:flex!important; align-items:flex-end!important; justify-content:space-between!important; gap:12px!important; } .hnf-live-workout-progress-copy>div{ min-width:0!important; } .hnf-live-workout-progress-copy span{ display:block!important; margin-bottom:3px!important; color:#a889ff!important; font-size:8px!important; font-weight:900!important; letter-spacing:.08em!important; } .hnf-live-workout-progress-copy strong{ display:block!important; color:#f4f1fb!important; font-size:12px!important; line-height:1.25!important; } .hnf-live-workout-progress-copy b{ flex:0 0 auto!important; color:#d8c8ff!important; font-size:16px!important; } .hnf-live-workout-progress-track{ height:7px!important; border-radius:999px!important; overflow:hidden!important; background:#282330!important; } .hnf-live-workout-progress-track i{ display:block!important; height:100%!important; border-radius:inherit!important; background:linear-gradient(90deg,#7c3aed,#a855f7)!important; transition:width .2s ease!important; } .hnf-live-workout-progress small{ color:#91899e!important; font-size:9px!important; line-height:1.35!important; } .hnf-live-workout-progress.is-complete{ border-color:rgba(34,197,94,.35)!important; background:linear-gradient(135deg,rgba(34,197,94,.09),rgba(18,17,24,.92))!important; } .hnf-live-workout-progress.is-complete .hnf-live-workout-progress-copy span, .hnf-live-workout-progress.is-complete .hnf-live-workout-progress-copy b{ color:#86efac!important; } .hnf-live-workout-progress.is-complete .hnf-live-workout-progress-track i{ background:linear-gradient(90deg,#16a34a,#22c55e)!important; } @media(max-width:900px){ .hnf-live-workout-progress{ margin:10px 0 13px!important; padding:10px!important; } .hnf-live-workout-progress-copy strong{ font-size:11px!important; } .hnf-live-workout-progress-copy b{ font-size:15px!important; } } /* v5.9.72 explicit workout completion */ .hnf-workout-complete-copy{color:#86efac!important;font-weight:700!important} .hnf-workout-complete-toast{position:fixed!important;left:50%!important;top:18px!important;z-index:2147483647!important;width:min(420px,calc(100vw - 28px))!important;transform:translate(-50%,-130%)!important;opacity:0!important;display:flex!important;flex-direction:column!important;gap:3px!important;padding:13px 16px!important;border:1px solid rgba(34,197,94,.42)!important;border-radius:14px!important;background:#111713!important;box-shadow:0 14px 40px rgba(0,0,0,.42)!important;color:#f0fdf4!important;transition:transform .22s ease,opacity .22s ease!important;pointer-events:none!important} .hnf-workout-complete-toast.is-showing{transform:translate(-50%,0)!important;opacity:1!important} .hnf-workout-complete-toast strong{color:#86efac!important;font-size:13px!important} .hnf-workout-complete-toast span{color:#d1d5db!important;font-size:10px!important} /* v5.9.73 Post-workout summary */ .hnf-post-workout-summary{ display:grid!important; gap:11px!important; margin:12px 0 16px!important; padding:13px!important; border:1px solid rgba(34,197,94,.34)!important; border-radius:14px!important; background:linear-gradient(135deg,rgba(34,197,94,.09),rgba(17,17,23,.95))!important; } .hnf-post-workout-summary-head{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; } .hnf-post-workout-summary-head span{ display:block!important; margin-bottom:3px!important; color:#86efac!important; font-size:8px!important; font-weight:900!important; letter-spacing:.09em!important; } .hnf-post-workout-summary-head h4{ margin:0!important; color:#f4f4f6!important; font-size:15px!important; } .hnf-post-workout-summary-head>b{ display:flex!important; align-items:center!important; justify-content:center!important; width:34px!important; height:34px!important; border-radius:999px!important; background:rgba(34,197,94,.15)!important; color:#86efac!important; font-size:18px!important; } .hnf-post-workout-summary-grid{ display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:8px!important; } .hnf-post-workout-summary-grid>div{ min-width:0!important; padding:9px!important; border:1px solid #2b3430!important; border-radius:10px!important; background:#111715!important; } .hnf-post-workout-summary-grid span, .hnf-post-workout-summary-grid strong{ display:block!important; } .hnf-post-workout-summary-grid span{ color:#8f9994!important; font-size:8px!important; text-transform:uppercase!important; letter-spacing:.05em!important; } .hnf-post-workout-summary-grid strong{ margin-top:4px!important; color:#f3f7f5!important; font-size:12px!important; overflow-wrap:anywhere!important; } .hnf-post-workout-summary>p{ margin:0!important; color:#9aa49f!important; font-size:10px!important; } .hnf-post-workout-back{ width:max-content!important; min-height:38px!important; } @media(max-width:700px){ .hnf-post-workout-summary-grid{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } .hnf-post-workout-back{ width:100%!important; min-height:44px!important; } } /* v6.0.0 Nutrition & Meal Planner */ .hnf-trainer-nutrition-launch{border-color:rgba(139,92,246,.38)!important} .hnf-nutrition-schema-warning{margin:10px 0;padding:12px;border:1px solid rgba(245,158,11,.38);border-radius:12px;background:rgba(245,158,11,.08);color:#facc15;font-size:12px} .hnf-nutrition-plan-card{border:1px solid #2d2d38;border-radius:15px;background:#121219;padding:15px;margin:10px 0} .hnf-nutrition-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px} .hnf-nutrition-plan-head h4{font-size:20px;margin:2px 0 3px}.hnf-nutrition-plan-head p{margin:0;color:#92929d;font-size:11px}.hnf-nutrition-kicker{font-size:9px;color:#a78bfa;font-weight:900;letter-spacing:.1em} .hnf-nutrition-macros,.hnf-client-nutrition-macros{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0} .hnf-nutrition-macros>div,.hnf-client-nutrition-macros>div{border:1px solid #2c2935;border-radius:10px;padding:10px;background:#16151d}.hnf-nutrition-macros span,.hnf-client-nutrition-macros span{display:block;color:#8d8996;font-size:9px}.hnf-nutrition-macros strong,.hnf-client-nutrition-macros strong{display:block;margin-top:4px;font-size:13px} .hnf-nutrition-day{border:1px solid #292933;border-radius:11px;margin-top:7px;overflow:hidden}.hnf-nutrition-day>summary{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;cursor:pointer;list-style:none}.hnf-nutrition-day>summary::-webkit-details-marker{display:none}.hnf-nutrition-day>div{padding:0 10px 8px} .hnf-nutrition-meal-row{display:flex;justify-content:space-between;gap:12px;padding:10px 2px;border-top:1px solid #25252e}.hnf-nutrition-meal-row:first-child{border-top:0}.hnf-nutrition-meal-row span,.hnf-nutrition-meal-row strong,.hnf-nutrition-meal-row small{display:block}.hnf-nutrition-meal-row span{font-size:9px;color:#a78bfa;text-transform:uppercase}.hnf-nutrition-meal-row strong{font-size:13px;margin-top:2px}.hnf-nutrition-meal-row small{font-size:10px;color:#8f8f9a;margin-top:3px}.hnf-nutrition-meal-macros{font-size:10px;color:#aaa4b4;white-space:nowrap} .hnf-client-nutrition-content{display:grid;gap:12px}.hnf-client-nutrition-hero{border:1px solid rgba(139,92,246,.42);border-radius:17px;padding:16px;background:linear-gradient(135deg,#21183a,#14141b)}.hnf-client-nutrition-hero h3{font-size:23px;margin:2px 0 4px}.hnf-client-nutrition-hero>p{margin:0;color:#a4a0ad;font-size:11px}.hnf-client-nutrition-note{margin-top:10px;padding:10px;border-radius:10px;background:rgba(255,255,255,.035);font-size:11px;color:#c7c2ce} .hnf-client-meal-day{border:1px solid #2b2b35;border-radius:14px;overflow:hidden;background:#121219;margin-top:9px}.hnf-client-meal-day>summary{display:flex;align-items:center;justify-content:space-between;padding:12px;cursor:pointer;list-style:none}.hnf-client-meal-day>summary::-webkit-details-marker{display:none}.hnf-client-meal-day>summary span,.hnf-client-meal-day>summary strong{display:block}.hnf-client-meal-day>summary span{font-size:8px;color:#a78bfa;font-weight:900}.hnf-client-meal-day>summary strong{font-size:13px;margin-top:2px}.hnf-client-meal-day>summary>b{display:flex;align-items:center;justify-content:center;width:27px;height:27px;border-radius:999px;background:#211a31;color:#c4b5fd;font-size:10px}.hnf-client-meal-list{display:grid;gap:8px;padding:0 10px 10px}.hnf-client-meal-card{border:1px solid #292933;border-radius:12px;background:#101016;padding:11px}.hnf-client-meal-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.hnf-client-meal-card-head span{display:block;color:#a78bfa;font-size:8px;text-transform:uppercase;font-weight:900}.hnf-client-meal-card h4{font-size:14px;margin:3px 0}.hnf-client-meal-card-head>b{font-size:10px;color:#d8ccff;white-space:nowrap}.hnf-client-meal-card>p{font-size:11px;color:#c7c3cc;line-height:1.45;margin:8px 0}.hnf-client-meal-macro-row{display:flex;gap:6px;flex-wrap:wrap}.hnf-client-meal-macro-row span{font-size:9px;padding:4px 7px;border-radius:999px;background:#1b1922;color:#bdb7c8}.hnf-client-meal-card>small{display:block;margin-top:8px;color:#928b9f;font-size:9px}.hnf-client-nutrition-empty{text-align:center;padding:38px 18px;border:1px dashed #32323d;border-radius:15px}.hnf-client-nutrition-empty>span{font-size:9px;color:#a78bfa;font-weight:900;letter-spacing:.1em}.hnf-client-nutrition-empty h3{margin:8px 0 4px}.hnf-client-nutrition-empty p{color:#8e8e99;font-size:11px} @media(max-width:900px){ .hnf-nutrition-plan-head{flex-direction:column}.hnf-nutrition-plan-head .hnf-row-actions{width:100%;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}.hnf-nutrition-plan-head .hnf-row-actions>*{width:100%!important} .hnf-nutrition-macros,.hnf-client-nutrition-macros{grid-template-columns:repeat(2,minmax(0,1fr))} .hnf-nutrition-meal-row{flex-direction:column}.hnf-nutrition-meal-macros{white-space:normal} html.hnf-client-phone-portrait .hnf-client-bottom-nav,html.hnf-client-mobile-device .hnf-client-bottom-nav{grid-template-columns:repeat(5,1fr)!important} .hnf-client-bottom-btn b{font-size:9px!important} } /* v6.0.1 Nutrition assigned-client visibility */ .hnf-nutrition-assigned{ margin:12px 0 4px!important; padding:10px 11px!important; border:1px solid rgba(139,92,246,.28)!important; border-radius:11px!important; background:rgba(139,92,246,.055)!important; } .hnf-nutrition-assigned-head{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important; margin-bottom:7px!important; } .hnf-nutrition-assigned-head span{ color:#a78bfa!important; font-size:8px!important; font-weight:900!important; letter-spacing:.08em!important; } .hnf-nutrition-assigned-head b{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-width:24px!important; height:24px!important; padding:0 7px!important; border-radius:999px!important; background:#2a2044!important; color:#d8c8ff!important; font-size:10px!important; } .hnf-nutrition-assigned-list{ display:flex!important; flex-wrap:wrap!important; gap:7px!important; } .hnf-nutrition-assigned-client{ display:flex!important; align-items:center!important; gap:7px!important; min-height:34px!important; padding:7px 9px!important; border:1px solid #34303f!important; border-radius:9px!important; background:#15141c!important; } .hnf-nutrition-assigned-client strong{ color:#f3effb!important; font-size:11px!important; } .hnf-nutrition-assigned-client small{ color:#8e8898!important; font-size:9px!important; } .hnf-nutrition-unassigned{ color:#8e8898!important; font-size:10px!important; } @media(max-width:700px){ .hnf-nutrition-assigned-list{display:grid!important;grid-template-columns:1fr!important} .hnf-nutrition-assigned-client{justify-content:space-between!important} } /* v6.0.2 Client Nutrition experience */ .hnf-mobile-subscreen-copy{ display:block!important; margin-top:3px!important; color:#8f8a98!important; font-size:9px!important; } .hnf-client-nutrition-hero-top{ display:flex!important; align-items:flex-start!important; justify-content:space-between!important; gap:12px!important; } .hnf-client-nutrition-active{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:24px!important; padding:4px 8px!important; border:1px solid rgba(34,197,94,.35)!important; border-radius:999px!important; background:rgba(34,197,94,.12)!important; color:#86efac!important; font-size:8px!important; font-weight:900!important; letter-spacing:.06em!important; } .hnf-client-nutrition-macros>div small{ display:block!important; margin-top:3px!important; color:#716d79!important; font-size:8px!important; } .hnf-client-nutrition-plan-meta{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:7px!important; margin-top:8px!important; } .hnf-client-nutrition-plan-meta>div{ padding:8px 9px!important; border:1px solid rgba(255,255,255,.07)!important; border-radius:9px!important; background:rgba(255,255,255,.025)!important; } .hnf-client-nutrition-plan-meta span, .hnf-client-nutrition-plan-meta strong{ display:block!important; } .hnf-client-nutrition-plan-meta span{ color:#85808d!important; font-size:8px!important; } .hnf-client-nutrition-plan-meta strong{ margin-top:3px!important; color:#f1edf7!important; font-size:10px!important; } .hnf-client-nutrition-note span{ display:block!important; margin-bottom:4px!important; color:#a78bfa!important; font-size:8px!important; font-weight:900!important; letter-spacing:.06em!important; } .hnf-client-nutrition-note p{ margin:0!important; color:#c7c2ce!important; font-size:10px!important; line-height:1.45!important; } .hnf-client-nutrition-section-head{ display:flex!important; align-items:end!important; justify-content:space-between!important; gap:12px!important; margin:4px 2px 8px!important; } .hnf-client-nutrition-section-head h3{ margin:2px 0 0!important; font-size:17px!important; } .hnf-client-nutrition-section-head>small{ color:#8c8794!important; font-size:9px!important; } .hnf-client-meal-day>summary{ gap:12px!important; } .hnf-client-meal-day-title span, .hnf-client-meal-day-title strong{ display:block!important; } .hnf-client-meal-day-title span{ color:#a78bfa!important; font-size:8px!important; font-weight:900!important; letter-spacing:.07em!important; } .hnf-client-meal-day-title strong{ margin-top:3px!important; color:#f1edf7!important; font-size:12px!important; } .hnf-client-meal-day-summary{ display:flex!important; align-items:center!important; gap:9px!important; color:#aaa5b2!important; font-size:9px!important; } .hnf-client-meal-day-summary b{ color:#a78bfa!important; transition:transform .15s ease!important; } .hnf-client-meal-day[open] .hnf-client-meal-day-summary b{ transform:rotate(180deg)!important; } .hnf-client-day-macro-summary{ display:flex!important; gap:6px!important; padding:0 10px 9px!important; flex-wrap:wrap!important; } .hnf-client-day-macro-summary span{ padding:4px 7px!important; border-radius:999px!important; background:#1b1922!important; color:#a9a3b2!important; font-size:8px!important; } .hnf-client-meal-card{ display:grid!important; grid-template-columns:30px minmax(0,1fr)!important; gap:9px!important; align-items:start!important; } .hnf-client-meal-index{ display:flex!important; align-items:center!important; justify-content:center!important; width:28px!important; height:28px!important; border-radius:999px!important; background:#2b1f46!important; color:#c4b5fd!important; font-size:10px!important; font-weight:900!important; } .hnf-client-meal-card-body{ min-width:0!important; } .hnf-client-meal-coach-note{ display:block!important; margin-top:8px!important; padding:7px 8px!important; border-left:2px solid #7c3aed!important; background:rgba(124,58,237,.06)!important; color:#aaa2b4!important; font-size:9px!important; line-height:1.4!important; } @media(max-width:700px){ .hnf-client-nutrition-hero{ padding:13px!important; border-radius:15px!important; } .hnf-client-nutrition-hero h3{ font-size:20px!important; } .hnf-client-nutrition-plan-meta{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } .hnf-client-meal-card{ grid-template-columns:26px minmax(0,1fr)!important; padding:10px!important; } .hnf-client-meal-index{ width:25px!important; height:25px!important; font-size:9px!important; } } /* v6.0.3 Nutrition meal tracking */ .hnf-nutrition-adherence{ display:inline-flex!important; align-items:center!important; justify-content:center!important; padding:4px 7px!important; border-radius:999px!important; background:rgba(34,197,94,.10)!important; border:1px solid rgba(34,197,94,.25)!important; color:#86efac!important; font-size:8px!important; font-weight:800!important; white-space:nowrap!important; } .hnf-client-nutrition-today{ display:grid!important; gap:8px!important; margin:12px 0!important; padding:11px 12px!important; border:1px solid rgba(139,92,246,.34)!important; border-radius:12px!important; background:rgba(124,58,237,.07)!important; } .hnf-client-nutrition-today-copy{ display:flex!important; align-items:flex-end!important; justify-content:space-between!important; gap:12px!important; } .hnf-client-nutrition-today-copy span{ display:block!important; color:#a78bfa!important; font-size:8px!important; font-weight:900!important; letter-spacing:.07em!important; } .hnf-client-nutrition-today-copy strong{ display:block!important; margin-top:3px!important; color:#f3eff8!important; font-size:11px!important; } .hnf-client-nutrition-today-copy>b{ color:#d8c8ff!important; font-size:15px!important; } .hnf-client-nutrition-today-track{ height:7px!important; border-radius:999px!important; overflow:hidden!important; background:#292431!important; } .hnf-client-nutrition-today-track i{ display:block!important; height:100%!important; border-radius:inherit!important; background:linear-gradient(90deg,#7c3aed,#a855f7)!important; transition:width .2s ease!important; } .hnf-client-nutrition-today>small{ color:#898391!important; font-size:8px!important; } .hnf-meal-complete{ width:100%!important; min-height:36px!important; margin-top:10px!important; border:1px solid rgba(139,92,246,.36)!important; border-radius:9px!important; background:rgba(124,58,237,.12)!important; color:#d9ccff!important; font-size:10px!important; font-weight:800!important; } .hnf-meal-complete.is-done{ border-color:rgba(34,197,94,.38)!important; background:rgba(34,197,94,.12)!important; color:#86efac!important; } .hnf-meal-complete:disabled{ opacity:.48!important; cursor:not-allowed!important; } @media(max-width:700px){ .hnf-nutrition-assigned-client{ gap:8px!important; } .hnf-nutrition-assigned-client>div{ min-width:0!important; } } /* HN Fitness v6.0.4 — Trainer Home Nutrition Adherence */ .hnf-nutrition-home-panel{margin-top:14px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.018)} .hnf-nutrition-adherence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px} .hnf-nutrition-home-card{padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025)} .hnf-nutrition-home-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .hnf-nutrition-home-top>div{display:flex;flex-direction:column;gap:3px} .hnf-nutrition-home-top strong{font-size:18px} .hnf-nutrition-home-top span,.hnf-nutrition-home-meta{color:var(--hnf-muted,#9a96a6);font-size:12px} .hnf-nutrition-home-top b{font-size:18px} .hnf-nutrition-home-bar{height:5px;margin:10px 0;background:rgba(255,255,255,.07);border-radius:99px;overflow:hidden} .hnf-nutrition-home-bar i{display:block;height:100%;background:#8754f5;border-radius:inherit} .hnf-nutrition-home-good .hnf-nutrition-home-bar i{background:#1fa463} .hnf-nutrition-home-low .hnf-nutrition-home-bar i{background:#d49b20} .hnf-nutrition-home-meta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:10px} @media(max-width:760px){ .hnf-nutrition-adherence-grid{grid-template-columns:1fr} .hnf-nutrition-home-panel{padding:10px} } /* v6.0.5 start-date-aware nutrition adherence */ .hnf-nutrition-adherence{ min-width:58px!important; } .hnf-nutrition-home-none .hnf-nutrition-home-bar i{ width:0!important; } /* v6.0.6 Coaching Calendar */ .hnf-trainer-calendar-launch{border-color:rgba(139,92,246,.38)!important} .hnf-calendar-controls,.hnf-client-calendar-controls{display:flex!important;align-items:center!important;gap:7px!important} .hnf-calendar-title{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:8px 0 10px!important} .hnf-calendar-title strong{font-size:20px!important} .hnf-calendar-title span{color:#8f8997!important;font-size:10px!important} .hnf-calendar-grid{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;border:1px solid #2c2b35!important;border-radius:13px!important;overflow:hidden!important;background:#101016!important} .hnf-calendar-weekday{padding:8px!important;border-right:1px solid #292832!important;border-bottom:1px solid #292832!important;background:#17161e!important;color:#8f8997!important;font-size:9px!important;font-weight:800!important;text-align:center!important} .hnf-calendar-day{min-height:110px!important;padding:7px!important;border-right:1px solid #292832!important;border-bottom:1px solid #292832!important} .hnf-calendar-day.is-outside{opacity:.34!important} .hnf-calendar-day.is-today{box-shadow:inset 0 0 0 1px #7c3aed!important;background:rgba(124,58,237,.05)!important} .hnf-calendar-day-head{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-bottom:6px!important} .hnf-calendar-day-head span{font-size:10px!important;font-weight:800!important} .hnf-calendar-day-head b{color:#a78bfa!important;font-size:7px!important} .hnf-calendar-events{display:grid!important;gap:4px!important} .hnf-calendar-event{display:block!important;width:100%!important;padding:5px 6px!important;border:1px solid transparent!important;border-radius:7px!important;text-align:left!important;background:#1b1923!important;color:#e8e4ee!important} .hnf-calendar-event strong,.hnf-calendar-event small{display:block!important} .hnf-calendar-event strong{font-size:8px!important;line-height:1.2!important}.hnf-calendar-event small{margin-top:2px!important;color:#96909d!important;font-size:7px!important} .hnf-calendar-event.is-workout{border-color:rgba(139,92,246,.32)!important} .hnf-calendar-event.is-nutrition{border-color:rgba(34,197,94,.32)!important} .hnf-calendar-event.is-checkin{border-color:rgba(59,130,246,.32)!important} .hnf-calendar-legend{display:flex!important;gap:14px!important;flex-wrap:wrap!important;margin-top:10px!important;color:#8f8997!important;font-size:9px!important} .hnf-calendar-legend span{display:flex!important;align-items:center!important;gap:5px!important}.hnf-calendar-legend i{width:8px!important;height:8px!important;border-radius:999px!important;background:#7c3aed!important}.hnf-calendar-legend i.is-nutrition{background:#22c55e!important}.hnf-calendar-legend i.is-checkin{background:#3b82f6!important} .hnf-client-calendar-screen{display:grid!important;gap:12px!important} .hnf-client-calendar-controls{justify-content:space-between!important;padding:0 2px!important} .hnf-client-calendar-controls strong{font-size:15px!important} .hnf-client-calendar-grid{border:1px solid #2b2a33!important;border-radius:14px!important;overflow:hidden!important;background:#111117!important} .hnf-client-calendar-weekdays{display:grid!important;grid-template-columns:repeat(7,1fr)!important;background:#17161e!important;border-bottom:1px solid #2b2a33!important} .hnf-client-calendar-weekdays span{padding:8px 2px!important;text-align:center!important;color:#8e8896!important;font-size:8px!important;font-weight:800!important} .hnf-client-calendar-days{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important} .hnf-client-calendar-day{min-height:90px!important;padding:5px!important;border-right:1px solid #292832!important;border-bottom:1px solid #292832!important} .hnf-client-calendar-day.is-outside{opacity:.28!important} .hnf-client-calendar-day.is-today{background:rgba(124,58,237,.08)!important;box-shadow:inset 0 0 0 1px #7c3aed!important} .hnf-client-calendar-date{margin-bottom:4px!important;color:#d9d4df!important;font-size:9px!important;font-weight:800!important} .hnf-client-calendar-event{padding:4px 5px!important;margin-top:3px!important;border-left:2px solid #7c3aed!important;border-radius:5px!important;background:#191821!important} .hnf-client-calendar-event.is-nutrition{border-left-color:#22c55e!important}.hnf-client-calendar-event.is-checkin{border-left-color:#3b82f6!important} .hnf-client-calendar-event strong,.hnf-client-calendar-event span{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important} .hnf-client-calendar-event strong{font-size:7px!important;white-space:nowrap!important}.hnf-client-calendar-event span{margin-top:1px!important;color:#8e8896!important;font-size:6px!important;white-space:nowrap!important} @media(max-width:900px){ .hnf-calendar-grid{min-width:780px!important} #hnf-panel-calendar{overflow-x:auto!important} html.hnf-client-phone-portrait .hnf-client-bottom-nav, html.hnf-client-mobile-device .hnf-client-bottom-nav{grid-template-columns:repeat(6,1fr)!important} .hnf-client-bottom-btn b{font-size:8px!important} } @media(max-width:600px){ .hnf-client-calendar-grid{overflow-x:auto!important} .hnf-client-calendar-weekdays,.hnf-client-calendar-days{min-width:620px!important} .hnf-client-calendar-day{min-height:82px!important} } /* v6.0.7 — client mobile navigation works in portrait AND landscape */ html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) .hnf-client-nav, html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) .hnf-client-grid-4{ display:none!important; } html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) .hnf-client-view[hidden], html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) #hnf-client-home-shell[hidden]{ display:none!important; } html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) .hnf-client-view.active{ display:block!important; } html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) #hnf-client-bottom-nav{ pointer-events:auto!important; touch-action:manipulation!important; } html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) #hnf-client-bottom-nav .hnf-client-bottom-btn{ pointer-events:auto!important; touch-action:manipulation!important; min-height:48px!important; } html.hnf-client-mobile-device:not(.hnf-client-phone-portrait) .hnf-client-card{ padding-bottom:66px!important; } /* v6.0.8 Google Calendar / Setmore privacy foundation */ .hnf-google-calendar-source{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;padding:11px 13px!important;margin:4px 0 12px!important;border:1px solid rgba(66,133,244,.28)!important;border-radius:12px!important;background:rgba(66,133,244,.055)!important} .hnf-google-calendar-source strong,.hnf-google-calendar-source span{display:block!important} .hnf-google-calendar-source strong{font-size:11px!important} .hnf-google-calendar-source>div>span{margin-top:3px!important;color:#8f8997!important;font-size:9px!important} .hnf-google-status{flex:0 0 auto!important;padding:5px 8px!important;border-radius:999px!important;background:#1c1b23!important;color:#a8a2ad!important;font-size:8px!important;font-weight:800!important} .hnf-calendar-legend i.is-google{background:#4285f4!important} .hnf-calendar-event.is-google{border-color:rgba(66,133,244,.4)!important;background:rgba(66,133,244,.08)!important} @media(max-width:700px){.hnf-google-calendar-source{align-items:flex-start!important;flex-direction:column!important}} /* v6.0.9 live Google Calendar connection */ .hnf-client-calendar-event.is-google{border-left-color:#4285f4!important;background:rgba(66,133,244,.07)!important} .hnf-google-status{white-space:nowrap} /* v6.1.0 Calendar polish */ .hnf-client-next-appointment{ margin:14px 0; padding:16px 18px; border:1px solid rgba(139,92,246,.24); border-radius:16px; background:linear-gradient(135deg,rgba(139,92,246,.10),rgba(15,23,42,.34)); display:flex; align-items:center; justify-content:space-between; gap:16px; } .hnf-client-next-appointment.has-appointment{ border-color:rgba(59,130,246,.45); box-shadow:0 10px 30px rgba(0,0,0,.16); } .hnf-next-appointment-copy{display:grid;gap:5px;min-width:0} .hnf-next-appointment-copy strong{font-size:1.05rem;line-height:1.25} .hnf-next-appointment-copy small{opacity:.72;line-height:1.4} .hnf-next-appointment-time{ flex:0 0 auto; font-size:1.05rem; font-weight:800; padding:10px 13px; border-radius:12px; background:rgba(59,130,246,.13); border:1px solid rgba(59,130,246,.34); } .hnf-client-calendar-date{display:flex;align-items:center;justify-content:space-between;gap:6px} .hnf-client-calendar-date span{ font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; opacity:.8; } .hnf-client-calendar-event.is-google strong{font-weight:800} .hnf-client-calendar-event.is-google span{font-weight:700} .hnf-client-calendar-agenda{ margin-top:16px; border:1px solid rgba(148,163,184,.14); border-radius:16px; padding:16px; background:rgba(15,23,42,.28); } .hnf-client-agenda-head{ display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px } .hnf-client-agenda-head>div{display:grid;gap:3px} .hnf-client-agenda-head small{opacity:.68} .hnf-client-agenda-list{display:grid;gap:8px} .hnf-client-agenda-item{ display:grid; grid-template-columns:minmax(88px,110px) 1fr; gap:12px; align-items:center; padding:11px 12px; border:1px solid rgba(148,163,184,.12); border-radius:12px; background:rgba(255,255,255,.025); } .hnf-client-agenda-item.is-google{border-color:rgba(59,130,246,.34)} .hnf-client-agenda-date{font-weight:800;font-size:.88rem} .hnf-client-agenda-item>div:last-child{display:grid;gap:3px;min-width:0} .hnf-client-agenda-item span{opacity:.72;font-size:.85rem} .hnf-client-calendar-controls{gap:8px} .hnf-client-calendar-today{padding-left:12px!important;padding-right:12px!important} @media (max-width: 720px){ .hnf-client-next-appointment{align-items:flex-start;flex-direction:column;padding:14px} .hnf-next-appointment-time{width:100%;box-sizing:border-box;text-align:center} .hnf-client-calendar-controls{ display:grid!important; grid-template-columns:auto 1fr auto auto; align-items:center; } .hnf-client-calendar-controls strong{font-size:.92rem;text-align:center} .hnf-client-calendar-today{font-size:.78rem;padding:9px!important} .hnf-client-calendar-grid{overflow-x:auto;-webkit-overflow-scrolling:touch} .hnf-client-calendar-weekdays,.hnf-client-calendar-days{min-width:680px} .hnf-client-calendar-agenda{padding:13px} .hnf-client-agenda-item{grid-template-columns:82px 1fr;padding:10px} } /* v6.1.1 Client home appointment + compact mobile calendar */ .hnf-client-home-appointment{margin:14px 0 16px} .hnf-client-home-appt-card,.hnf-client-home-appt-empty{ display:flex;align-items:center;justify-content:space-between;gap:16px; padding:16px 18px;border:1px solid rgba(59,130,246,.32);border-radius:16px; background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(139,92,246,.08)); } .hnf-client-home-appt-empty{border-color:rgba(139,92,246,.22)} .hnf-client-home-appt-copy,.hnf-client-home-appt-empty>div{display:grid;gap:5px;min-width:0} .hnf-client-home-appt-copy strong,.hnf-client-home-appt-empty strong{font-size:1.02rem} .hnf-client-home-appt-copy small,.hnf-client-home-appt-empty small{opacity:.72;line-height:1.4} .hnf-client-home-appt-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto} .hnf-client-home-appt-time{ font-weight:800;padding:9px 11px;border-radius:10px; background:rgba(59,130,246,.14);border:1px solid rgba(59,130,246,.3) } .hnf-client-calendar-view-toggle{display:flex;gap:8px;margin:12px 0 4px} .hnf-client-calendar-view-toggle button{ flex:1;background:transparent;border:1px solid rgba(148,163,184,.18) } .hnf-client-calendar-view-toggle button.is-active{ background:rgba(139,92,246,.18);border-color:rgba(139,92,246,.5) } .hnf-client-calendar-month-view,.hnf-client-calendar-agenda-view{display:block} @media (max-width:720px){ .hnf-client-home-appt-card,.hnf-client-home-appt-empty{ flex-direction:column;align-items:stretch;padding:14px } .hnf-client-home-appt-actions{display:grid;grid-template-columns:1fr auto} .hnf-client-home-appt-time{text-align:center} .hnf-client-calendar-month-view{display:none} .hnf-client-calendar-agenda-view{display:block} .hnf-client-calendar-month-view.is-selected{display:block} .hnf-client-calendar-agenda-view:not(.is-selected){display:none} .hnf-client-calendar-view-toggle{ position:sticky;top:0;z-index:2;background:#0b0b11;padding:8px 0 } } \n\n/* v6.1.2 Calendar duplicate-card + mobile mode fix */ .hnf-client-mobile-device .hnf-client-calendar-month-view{display:none!important} .hnf-client-mobile-device .hnf-client-calendar-agenda-view{display:block!important} .hnf-client-mobile-device .hnf-client-calendar-month-view.is-selected{display:block!important} .hnf-client-mobile-device .hnf-client-calendar-agenda-view:not(.is-selected){display:none!important} .hnf-client-mobile-device #hnf-client-home-appointment[hidden]{display:none!important} .hnf-client-mobile-device .hnf-client-calendar-view-toggle{display:flex!important} @media (max-width:900px){ .hnf-client-calendar-controls{grid-template-columns:auto 1fr auto auto!important} .hnf-client-calendar-view-toggle{gap:6px} } /* v6.1.3 Client Calendar Agenda/Month visibility fix */ html.hnf-client-mobile-device .hnf-client-calendar-month-view{ display:none !important; } html.hnf-client-mobile-device .hnf-client-calendar-agenda-view{ display:block !important; } html.hnf-client-mobile-device .hnf-client-calendar-month-view[style*="display: block"]{ display:block !important; } html.hnf-client-mobile-device .hnf-client-calendar-agenda-view[style*="display: none"]{ display:none !important; } html.hnf-client-mobile-device .hnf-client-calendar-month-view[hidden], html.hnf-client-mobile-device .hnf-client-calendar-agenda-view[hidden]{ display:none !important; } /* v6.1.4 Client agenda dedupe + grouped dates */ .hnf-client-agenda-list{display:grid;gap:14px} .hnf-client-agenda-day{ display:grid; grid-template-columns:minmax(112px,140px) 1fr; gap:12px; align-items:start; } .hnf-client-agenda-day-label{ font-weight:800; font-size:.86rem; opacity:.9; padding:11px 0; } .hnf-client-agenda-day-items{display:grid;gap:8px} .hnf-client-agenda-item{ grid-template-columns:minmax(76px,92px) 1fr; } .hnf-client-agenda-type{ font-size:.68rem; font-weight:900; letter-spacing:.06em; opacity:.72; } .hnf-client-agenda-item.is-google .hnf-client-agenda-type{opacity:1} .hnf-client-agenda-item.is-google strong{font-weight:850} @media (max-width:720px){ .hnf-client-agenda-day{ grid-template-columns:1fr; gap:6px; } .hnf-client-agenda-day-label{ padding:3px 2px 1px; font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; opacity:.72; } .hnf-client-agenda-item{ grid-template-columns:72px 1fr; } } /* v6.1.5 Calendar mode active-state fix */ .hnf-client-calendar-view-toggle button{ background:transparent !important; border-color:rgba(148,163,184,.18) !important; color:inherit; } .hnf-client-calendar-view-toggle button.is-active, .hnf-client-calendar-view-toggle button[aria-pressed="true"]{ background:rgba(139,92,246,.28) !important; border-color:rgba(139,92,246,.62) !important; box-shadow:inset 0 0 0 1px rgba(139,92,246,.08); } /* v6.2.0 PDF / print exports */ .hnf-client-nutrition-hero-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; } .hnf-client-nutrition-hero-actions .hnf-client-export-meal-plan{ padding:8px 11px; font-size:.78rem; } @media(max-width:720px){ .hnf-client-nutrition-hero-actions{ width:100%; justify-content:space-between; } } /* v6.2.2 reliable native print layer */ #hnf-print-root{display:none} @media print{ html.hnf-print-mode body > *:not(#hnf-print-root){display:none !important} html.hnf-print-mode #hnf-print-root{ display:block !important; position:static !important; width:auto !important; height:auto !important; overflow:visible !important; background:#fff !important; color:#171717 !important; } html.hnf-print-mode #hnf-print-root *{visibility:visible !important} .hnf-print-page{font-family:Arial,Helvetica,sans-serif;color:#171717;background:#fff;padding:0} .hnf-print-brand{font-size:13px;letter-spacing:.16em;font-weight:800;color:#6d28d9;margin-bottom:8px} .hnf-print-page h1{font-size:30px;margin:0 0 6px} .hnf-print-page h2{font-size:19px;margin:28px 0 10px} .hnf-print-sub{color:#666;margin-bottom:24px} .hnf-print-meta{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 22px} .hnf-print-meta span{border:1px solid #ddd;border-radius:999px;padding:7px 10px;font-size:12px} .hnf-print-page table{width:100%;border-collapse:collapse;margin:10px 0 22px} .hnf-print-page th,.hnf-print-page td{text-align:left;border-bottom:1px solid #ddd;padding:10px 8px;vertical-align:top} .hnf-print-page th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#666} .hnf-print-note{color:#555;font-size:13px} .hnf-print-day{page-break-inside:avoid} .hnf-print-footer{margin-top:36px;padding-top:14px;border-top:1px solid #ddd;color:#777;font-size:11px} @page{margin:14mm} } /* v6.2.3 exact HN Fitness branding */ .hnf-trainer-brand-logo img{display:block;width:min(260px,70%);max-height:88px;object-fit:contain;object-position:left center} .hnf-client-welcome-splash{ display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr); min-height:560px;overflow:hidden;border:1px solid rgba(139,92,246,.22);border-radius:22px; background:radial-gradient(circle at 20% 20%,rgba(124,58,237,.16),transparent 36%),linear-gradient(135deg,#0b0b11,#10111a) } .hnf-client-welcome-splash[hidden]{display:none!important} .hnf-client-welcome-copy{padding:44px;display:flex;flex-direction:column;justify-content:center} .hnf-client-brand-logo{width:min(320px,78%);max-height:120px;object-fit:contain;object-position:left center;margin-bottom:24px} .hnf-client-welcome-kicker{font-size:.72rem;letter-spacing:.16em;font-weight:900;color:#a78bfa;margin-bottom:10px} .hnf-client-welcome-copy h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1.02;margin:0 0 16px} .hnf-client-welcome-copy p{max-width:580px;font-size:1rem;line-height:1.6;opacity:.78} .hnf-client-welcome-actions{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0} .hnf-client-welcome-actions a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .hnf-client-welcome-features{display:flex;gap:8px;flex-wrap:wrap} .hnf-client-welcome-features span{padding:8px 11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;font-size:.78rem;opacity:.82} .hnf-client-welcome-photo-wrap{position:relative;min-height:560px;background:#08090d} .hnf-client-welcome-photo-wrap:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#0b0b11 0%,transparent 35%),linear-gradient(0deg,rgba(8,9,13,.35),transparent 42%)} .hnf-client-welcome-photo{width:100%;height:100%;object-fit:cover;object-position:center 14%;display:block} .hnf-profile-created-splash{min-height:70vh;display:grid;place-items:center;padding:28px} .hnf-profile-created-splash[hidden]{display:none!important} .hnf-profile-created-card{width:min(520px,100%);text-align:center;padding:36px;border:1px solid rgba(139,92,246,.28);border-radius:22px;background:linear-gradient(145deg,#11121b,#0b0b11);box-shadow:0 28px 70px rgba(0,0,0,.34)} .hnf-profile-created-logo{width:min(260px,72%);max-height:105px;object-fit:contain;margin:0 auto 22px} .hnf-profile-created-check{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;border:3px solid #8b5cf6;color:#c4b5fd;font-size:2.1rem;font-weight:900} .hnf-profile-created-card>span{font-size:.72rem;letter-spacing:.16em;color:#a78bfa;font-weight:900} .hnf-profile-created-card h2{font-size:2rem;margin:8px 0} .hnf-profile-created-card p{opacity:.76;line-height:1.55;margin-bottom:22px} @media(max-width:760px){ .hnf-client-welcome-splash{grid-template-columns:1fr;min-height:0} .hnf-client-welcome-copy{padding:28px 22px} .hnf-client-brand-logo{width:min(260px,80%);margin-bottom:18px} .hnf-client-welcome-photo-wrap{min-height:330px;order:-1} .hnf-client-welcome-photo-wrap:before{background:linear-gradient(0deg,#0b0b11 0%,transparent 58%)} .hnf-client-welcome-photo{object-position:center 10%} .hnf-client-welcome-actions>*{flex:1 1 150px} } @media print{ .hnf-print-brand{display:flex!important;align-items:center;gap:10px} .hnf-print-brand img{display:block!important;height:46px;width:auto;max-width:190px;object-fit:contain} .hnf-print-brand span{font-size:11px;letter-spacing:.12em;color:#6d28d9;font-weight:800} } /* v6.2.4 welcome/invite flow correction */ #hnf-client-welcome-splash[hidden], #hnf-login-choice[hidden], #hnf-client-auth[hidden], #hnf-client-session-switch[hidden], #hnf-client-dashboard[hidden], #hnf-profile-created-splash[hidden]{ display:none !important; } .hnf-client-card > #hnf-client-status:empty{display:none} .hnf-client-welcome-splash{ grid-template-columns:minmax(0,.95fr) minmax(320px,1.05fr); min-height:620px; } .hnf-client-brand-wordmark{ display:block; width:min(390px,94%); max-height:125px; object-fit:cover; object-position:center; border-radius:12px; margin:0 0 28px; box-shadow:0 12px 32px rgba(0,0,0,.24); } .hnf-client-welcome-copy h1{ max-width:620px; font-size:clamp(2.25rem,5vw,4rem); } .hnf-client-welcome-photo-wrap{min-height:620px} .hnf-client-welcome-photo{ object-fit:cover; object-position:center 10%; } .hnf-auth-brand{ display:grid; gap:10px; margin-bottom:18px; } .hnf-auth-brand img{ width:min(300px,80%); max-height:95px; object-fit:cover; object-position:center; border-radius:10px; } .hnf-auth-brand span{ color:#a78bfa; letter-spacing:.14em; font-size:.7rem; font-weight:900; } @media(max-width:760px){ .hnf-client-app{padding-top:8px} .hnf-client-welcome-splash{ grid-template-columns:1fr; min-height:0; border-radius:18px; } .hnf-client-welcome-photo-wrap{ order:-1; min-height:360px; max-height:440px; } .hnf-client-welcome-photo-wrap:before{ background:linear-gradient(0deg,#0b0b11 0%,rgba(11,11,17,.2) 48%,transparent 72%); } .hnf-client-welcome-copy{padding:24px 20px 30px} .hnf-client-brand-wordmark{width:min(330px,96%);margin-bottom:20px} .hnf-client-welcome-copy h1{font-size:2.3rem} .hnf-client-welcome-copy p{font-size:.95rem} .hnf-client-welcome-features{display:grid;grid-template-columns:1fr;gap:7px} } /* v6.2.5 branded app shell / onboarding polish */ .hnf-client-card{ border-radius:24px!important; overflow:hidden; background: radial-gradient(circle at 90% 0%,rgba(124,58,237,.10),transparent 30%), #0b0b11!important; } .hnf-client-welcome-splash{ min-height:680px!important; background: radial-gradient(circle at 78% 18%,rgba(139,92,246,.17),transparent 30%), linear-gradient(135deg,#08090d 0%,#111320 100%)!important; } .hnf-client-welcome-copy{position:relative;z-index:2} .hnf-client-brand-wordmark{ box-shadow:none!important; background:transparent!important; border-radius:0!important; width:min(430px,96%)!important; max-height:120px!important; object-fit:cover!important; } .hnf-client-welcome-actions{ display:grid!important; grid-template-columns:1fr!important; max-width:360px; } .hnf-client-welcome-actions button{ min-height:48px; border-radius:10px!important; font-size:.95rem; } .hnf-client-welcome-actions .secondary{ background:transparent!important; border:1px solid rgba(139,92,246,.65)!important; } .hnf-client-welcome-photo-wrap{min-height:680px!important} .hnf-client-welcome-photo{ object-position:center 8%!important; filter:saturate(.98) contrast(1.02); } .hnf-client-welcome-features{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px!important; margin-top:22px; } .hnf-client-welcome-features span{ min-height:72px; display:grid; place-items:center; text-align:center; border-radius:14px!important; background:rgba(255,255,255,.025); } .hnf-auth-brand img{ width:min(360px,88%)!important; max-height:105px!important; box-shadow:none!important; } .hnf-client-dashboard-brand{ display:flex; align-items:center; margin:0 0 14px; } .hnf-client-dashboard-brand img{ width:min(220px,54vw); max-height:72px; object-fit:cover; object-position:center; border-radius:8px; } .hnf-client-home-shell .hnf-trainer-head{ padding:18px!important; border:1px solid rgba(255,255,255,.07); border-radius:18px; background:rgba(255,255,255,.02); } .hnf-client-grid-4 .hnf-trainer-stat{ border-radius:16px!important; background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(139,92,246,.04))!important; } .hnf-client-nav{ padding:6px!important; border:1px solid rgba(255,255,255,.07); border-radius:14px!important; background:rgba(255,255,255,.018); } .hnf-client-bottom-nav{ backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); background:rgba(9,9,15,.95)!important; border-top:1px solid rgba(255,255,255,.08)!important; } .hnf-client-bottom-btn.active{ box-shadow:0 0 0 1px rgba(139,92,246,.28),0 10px 26px rgba(76,29,149,.25)!important; } @media(max-width:760px){ .hnf-client-welcome-splash{min-height:0!important} .hnf-client-welcome-photo-wrap{min-height:420px!important;max-height:480px!important} .hnf-client-welcome-copy{padding:22px 20px 28px!important} .hnf-client-brand-wordmark{width:min(350px,98%)!important} .hnf-client-welcome-features{grid-template-columns:1fr!important} } /* v6.2.6 sample-matched brand refinement */ .hnf-client-welcome-splash{background:radial-gradient(circle at 75% 20%,rgba(139,92,246,.22),transparent 34%),linear-gradient(135deg,#07080d,#0d0a18 60%,#090a10)!important;border:1px solid rgba(139,92,246,.32)!important;box-shadow:0 28px 90px rgba(0,0,0,.48)!important} .hnf-client-brand-wordmark{width:min(360px,86%)!important;max-height:150px!important;object-fit:cover!important;object-position:center 38%!important;border-radius:18px!important;border:1px solid rgba(139,92,246,.24)!important;box-shadow:0 16px 45px rgba(0,0,0,.35)!important} .hnf-client-welcome-copy h1{font-weight:900!important;letter-spacing:-.035em!important} .hnf-client-welcome-actions button{min-height:50px!important;border-radius:12px!important;font-weight:800!important} .hnf-client-welcome-photo-wrap{overflow:hidden!important} .hnf-client-welcome-photo{filter:saturate(1.02) contrast(1.02)!important} @media(max-width:700px){.hnf-client-brand-wordmark{width:100%!important;max-height:112px!important}.hnf-client-welcome-photo-wrap{min-height:440px!important}.hnf-client-welcome-photo{object-position:center 9%!important}} /* v6.2.7 new HN Fitness brand/icon correction */ .hnf-client-brand-wordmark, .hnf-auth-brand img, .hnf-client-dashboard-brand img, .hnf-profile-created-logo{ object-fit:contain !important; object-position:center !important; background:transparent !important; box-shadow:none !important; border-radius:18px !important; } .hnf-client-brand-wordmark{ width:min(240px,62%) !important; max-height:240px !important; aspect-ratio:1/1; margin:0 0 22px !important; } .hnf-client-dashboard-brand{ margin:0 0 16px !important; } .hnf-client-dashboard-brand img{ width:86px !important; height:86px !important; max-height:none !important; } .hnf-auth-brand img{ width:110px !important; height:110px !important; max-height:none !important; } .hnf-profile-created-logo{ width:130px !important; height:130px !important; max-height:none !important; } @media(max-width:760px){ .hnf-client-brand-wordmark{ width:150px !important; max-height:150px !important; margin:0 auto 18px !important; } .hnf-client-dashboard-brand img{ width:72px !important; height:72px !important; } } /* v6.2.8 hide purple client menu during splash/login/onboarding */ html.hnf-client-pre-dashboard #hnf-client-bottom-nav, html.hnf-client-pre-dashboard .hnf-client-bottom-nav, #hnf-client-bottom-nav[hidden]{ display:none !important; } html.hnf-client-pre-dashboard body, html.hnf-client-pre-dashboard .hnf-client-app, html.hnf-client-pre-dashboard .hnf-client-card{ padding-bottom:0 !important; } /* v6.2.9 duplicate logo cleanup */ .hnf-client-card > .hnf-trainer-brand-logo{display:none!important} #hnf-client-status[hidden]{display:none!important} .hnf-client-dashboard-brand{margin:0 0 12px!important} .hnf-client-dashboard-brand img{width:74px!important;height:74px!important;border-radius:16px!important} @media(max-width:760px){ .hnf-client-dashboard-brand img{width:64px!important;height:64px!important} } /* v6.3.0 client progress photo comparison */ .hnf-client-photo-compare-card{overflow:hidden} .hnf-client-photo-compare-shell{display:grid;gap:14px} .hnf-client-photo-compare-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap} .hnf-photo-type-tabs{display:flex;gap:7px;flex-wrap:wrap} .hnf-photo-type-tabs button{padding:8px 11px;border-radius:999px;background:#11121a;border:1px solid #2b2c38;color:#d6d6df;font-weight:700} .hnf-photo-type-tabs button small{opacity:.55;margin-left:4px} .hnf-photo-type-tabs button.is-active{background:rgba(139,92,246,.22);border-color:#8b5cf6;color:#fff} .hnf-photo-swap{padding:8px 12px!important} .hnf-photo-compare-selectors{display:grid;grid-template-columns:1fr 1fr;gap:10px} .hnf-photo-compare-selectors label{display:grid;gap:6px} .hnf-photo-compare-selectors label>span{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#a8a8b5;font-weight:800} .hnf-photo-compare-selectors select{width:100%;margin:0!important} .hnf-photo-slider{position:relative;overflow:hidden;border-radius:18px;border:1px solid rgba(139,92,246,.35);background:#08090d;aspect-ratio:4/5;max-height:680px;user-select:none} .hnf-photo-slider>img,.hnf-photo-slider-before-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block} .hnf-photo-slider-before-wrap{position:absolute;inset:0 auto 0 0;width:50%;overflow:hidden;z-index:2} .hnf-photo-slider-before-wrap img{width:100vw;max-width:none} .hnf-photo-slider-divider{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;z-index:4;transform:translateX(-1px);box-shadow:0 0 18px rgba(139,92,246,.8)} .hnf-photo-slider-divider i{position:absolute;left:50%;top:50%;width:42px;height:42px;border-radius:50%;transform:translate(-50%,-50%);background:#8b5cf6;border:3px solid #fff;box-shadow:0 6px 20px rgba(0,0,0,.45)} .hnf-photo-slider-divider i:before{content:"↔";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:18px;font-style:normal;font-weight:900} .hnf-photo-slider-range{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:ew-resize!important;z-index:6!important;margin:0!important} .hnf-photo-slider-label{position:absolute;top:12px;z-index:5;padding:6px 9px;border-radius:999px;background:rgba(5,6,10,.72);backdrop-filter:blur(8px);font-size:.67rem;letter-spacing:.09em;font-weight:900} .hnf-photo-slider-label.is-before{left:12px}.hnf-photo-slider-label.is-after{right:12px} .hnf-photo-compare-caption{display:flex;gap:10px 18px;justify-content:space-between;flex-wrap:wrap;color:#a6a6b1;font-size:.8rem} .hnf-photo-compare-caption b{color:#fff} .hnf-photo-compare-empty{display:grid;gap:6px;padding:18px;border:1px dashed #30313c;border-radius:14px;background:rgba(255,255,255,.015)} .hnf-photo-compare-empty span{color:#92929e;font-size:.85rem} @media(max-width:720px){ .hnf-photo-compare-selectors{grid-template-columns:1fr} .hnf-photo-slider{aspect-ratio:3/4} .hnf-photo-slider-before-wrap img{width:100vw} .hnf-photo-compare-caption{display:grid;gap:4px} } /* v6.3.1 progress photo compare polish */ .hnf-client-photo-compare-card{ padding:22px !important; } .hnf-client-photo-compare-shell{ gap:16px !important; } .hnf-photo-compare-toolbar{ align-items:flex-end !important; } .hnf-photo-compare-toolbar-label{ display:block; margin:0 0 7px; font-size:.66rem; letter-spacing:.13em; font-weight:900; color:#8f90a0; } .hnf-photo-compare-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; } .hnf-photo-fit-mode.is-active{ border-color:#8b5cf6 !important; background:rgba(139,92,246,.18) !important; color:#fff !important; } .hnf-photo-type-tabs button{ min-width:82px; justify-content:center; } .hnf-photo-compare-selectors{ max-width:760px; } .hnf-photo-slider{ width:100%; max-width:980px; margin:0 auto; aspect-ratio:16/11; max-height:none !important; } .hnf-photo-slider>img, .hnf-photo-slider-before-wrap img{ object-fit:cover !important; object-position:center center !important; } .hnf-photo-slider-before-wrap{ overflow:hidden; } .hnf-photo-slider-before-wrap img{ width:calc(100vw - 220px) !important; max-width:980px !important; height:100% !important; } .hnf-photo-slider.is-fit{ background: linear-gradient(45deg,#0d0e14 25%,#11131b 25%,#11131b 50%,#0d0e14 50%,#0d0e14 75%,#11131b 75%); background-size:22px 22px; } .hnf-photo-slider.is-fit>img, .hnf-photo-slider.is-fit .hnf-photo-slider-before-wrap img{ object-fit:contain !important; } .hnf-photo-compare-caption{ max-width:980px; width:100%; margin:0 auto; padding:0 4px; } .hnf-mobile-photos-card .hnf-photo-grid{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important; } .hnf-mobile-photos-card .hnf-photo-card img{ aspect-ratio:3/4; object-fit:cover; object-position:center; } @media(min-width:980px){ .hnf-client-photo-compare-card{ grid-column:1/-1; } .hnf-photo-compare-selectors{ grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; margin:0 auto; width:100%; } } @media(max-width:720px){ .hnf-client-photo-compare-card{ padding:16px !important; } .hnf-client-photo-compare-toolbar{ align-items:stretch !important; } .hnf-photo-compare-actions{ width:100%; } .hnf-photo-compare-actions button{ flex:1; } .hnf-photo-type-tabs{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; } .hnf-photo-type-tabs button{ width:100%; min-width:0; } .hnf-photo-slider{ aspect-ratio:4/5 !important; } .hnf-photo-slider-before-wrap img{ width:calc(100vw - 64px) !important; max-width:none !important; } } /* v6.3.2 interactive progress insights */ .hnf-progress-insights-shell{display:grid;gap:16px}.hnf-progress-insights-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}.hnf-progress-metric-tabs,.hnf-progress-range-tabs{display:flex;gap:7px;flex-wrap:wrap}.hnf-progress-metric-tabs button,.hnf-progress-range-tabs button{padding:8px 11px;border-radius:999px;border:1px solid #2d2e3a;background:#11121a;color:#cfd0d8;font-weight:800;font-size:.78rem}.hnf-progress-metric-tabs button.is-active,.hnf-progress-range-tabs button.is-active{background:rgba(139,92,246,.22);border-color:#8b5cf6;color:#fff}.hnf-progress-insights-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.hnf-progress-insights-summary>div{padding:14px;border:1px solid #282934;border-radius:14px;background:rgba(255,255,255,.018)}.hnf-progress-insights-summary span{display:block;color:#92939f;font-size:.72rem;margin-bottom:5px}.hnf-progress-insights-summary strong{font-size:1.02rem;color:#fff}.hnf-progress-insights-summary strong.is-up{color:#a78bfa}.hnf-progress-insights-summary strong.is-down{color:#71d89a}.hnf-progress-chart-wrap{position:relative;border:1px solid #282934;border-radius:16px;background:linear-gradient(180deg,rgba(139,92,246,.035),rgba(255,255,255,.01));overflow:hidden}#hnf-progress-insight-chart{display:block;width:100%;height:auto;min-height:250px}.hnf-chart-grid{stroke:#272833;stroke-width:1}.hnf-chart-ylabel{fill:#777985;font-size:12px}.hnf-chart-area{fill:rgba(139,92,246,.10)}.hnf-chart-line{fill:none;stroke:#a78bfa;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.hnf-chart-dot{fill:#8b5cf6;stroke:#fff;stroke-width:3;cursor:pointer}.hnf-progress-chart-tooltip{position:absolute;transform:translate(-50%,-115%);z-index:5;pointer-events:none;padding:8px 10px;border-radius:10px;background:#08090d;border:1px solid rgba(139,92,246,.55);box-shadow:0 10px 30px rgba(0,0,0,.35);white-space:nowrap}.hnf-progress-chart-tooltip strong,.hnf-progress-chart-tooltip span{display:block}.hnf-progress-chart-tooltip strong{font-size:.82rem}.hnf-progress-chart-tooltip span{font-size:.68rem;color:#9a9ba6;margin-top:2px}.hnf-progress-chart-axis{display:flex;justify-content:space-between;gap:10px;color:#7f808c;font-size:.7rem;padding:0 5px}.hnf-progress-insights-empty{display:grid;gap:6px;padding:18px;border:1px dashed #30313c;border-radius:14px;background:rgba(255,255,255,.015)}.hnf-progress-insights-empty span{color:#92929e;font-size:.85rem}@media(max-width:720px){.hnf-progress-insights-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.hnf-progress-metric-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.hnf-progress-metric-tabs button{width:100%}.hnf-progress-range-tabs{width:100%}.hnf-progress-range-tabs button{flex:1}#hnf-progress-insight-chart{min-height:210px}} /* v6.3.3 trainer desktop render guard Prevent Android/DeX/desktop-mode browsers from pinning trainer stat cards to the bottom of wide screens. */ @media (min-width:1101px){ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid, html.hnf-trainer-desktop #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid{ position:static !important; left:auto !important; right:auto !important; bottom:auto !important; width:auto !important; display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:14px !important; margin:22px 0 !important; padding:0 !important; background:transparent !important; border-top:0 !important; box-shadow:none !important; z-index:auto !important; min-height:0 !important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card, html.hnf-trainer-desktop #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card{ min-height:0 !important; padding:20px !important; border:1px solid #2a2a33 !important; border-radius:14px !important; background:#15151b !important; display:block !important; text-align:left !important; color:#fff !important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card strong, html.hnf-trainer-desktop #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card strong{ font-size:30px !important; line-height:1.1 !important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card span, html.hnf-trainer-desktop #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card span{ font-size:inherit !important; margin-top:4px !important; color:#aaa !important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card:first-child span::after{ content:none !important; } html.hnf-trainer-phone body, html.hnf-trainer-desktop body{ padding-bottom:0 !important; } } /* v6.4.0 Mock-up Match Phase 1 — Client Home / Dashboard */ #hnf-client-dashboard{position:relative;isolation:isolate} .hnf-client-desktop-rail{display:none} .hnf-client-mobile-head-actions{display:none} .hnf-client-premium-hero{position:relative;overflow:hidden} .hnf-client-premium-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 30%,rgba(124,58,237,.30),transparent 34%),linear-gradient(120deg,rgba(5,7,12,.98) 0%,rgba(8,10,19,.94) 56%,rgba(36,14,70,.78) 100%);pointer-events:none} .hnf-client-premium-hero>*{position:relative;z-index:2} .hnf-client-welcome-back{display:block;color:#c7c9d4;font-size:.82rem;letter-spacing:.01em;margin-bottom:4px} .hnf-client-premium-hero #hnf-client-welcome{font-size:2rem!important;line-height:1.05!important;margin:0 0 8px!important;letter-spacing:-.035em} .hnf-client-premium-hero #hnf-client-goal{max-width:520px;color:#9fa3b2!important} .hnf-client-hero-copy{min-width:0;position:relative;z-index:3} .hnf-client-hero-photo{display:none} @media(min-width:980px){ #hnf-client-dashboard{padding-left:188px!important;min-height:760px} .hnf-client-desktop-rail{display:flex;flex-direction:column;position:absolute;z-index:20;left:0;top:0;bottom:0;width:166px;padding:18px 12px;border-right:1px solid rgba(255,255,255,.075);background:linear-gradient(180deg,#080a10 0%,#090b12 100%);border-radius:18px 0 0 18px} .hnf-client-rail-brand{padding:0 6px 18px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:12px} .hnf-client-rail-brand img{width:116px;height:116px;display:block;margin:auto;object-fit:contain;filter:drop-shadow(0 10px 28px rgba(96,38,214,.20))} .hnf-client-rail-nav{display:grid;gap:5px} .hnf-client-rail-nav button,.hnf-client-rail-foot button{width:100%;display:flex;align-items:center;gap:10px;justify-content:flex-start;text-align:left;border:0!important;background:transparent!important;color:#b9bcc8!important;padding:10px 11px!important;border-radius:9px!important;min-height:40px!important;box-shadow:none!important;font-size:.78rem!important} .hnf-client-rail-nav button span,.hnf-client-rail-foot button span{width:18px;text-align:center;color:#d5d7df;font-size:1rem} .hnf-client-rail-nav button.is-active,.hnf-client-rail-nav button:hover{background:linear-gradient(90deg,rgba(124,58,237,.78),rgba(91,33,182,.55))!important;color:#fff!important} .hnf-client-rail-foot{margin-top:auto;display:grid;gap:8px;border-top:1px solid rgba(255,255,255,.07);padding-top:12px} .hnf-client-rail-foot small{color:#676b78;font-size:.62rem;padding:0 10px} .hnf-client-dashboard-brand{display:none!important} .hnf-client-home-shell .hnf-trainer-head.hnf-client-premium-hero{min-height:238px!important;padding:30px 330px 24px 28px!important;display:block!important;border:1px solid rgba(124,58,237,.26)!important;background:#080a11!important;box-shadow:0 20px 60px rgba(0,0,0,.32)!important} .hnf-client-premium-hero #hnf-client-welcome{font-size:2.25rem!important} .hnf-client-hero-photo{display:block!important;position:absolute!important;z-index:1!important;right:-12px;bottom:-150px;width:360px;height:450px;pointer-events:none} .hnf-client-hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#080a11 0%,transparent 34%,transparent 80%),linear-gradient(0deg,#080a11 0%,transparent 34%)} .hnf-client-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 12%;filter:saturate(.95) contrast(1.04)} .hnf-client-notification-wrap{max-width:570px;margin-top:18px!important;position:relative;z-index:4} .hnf-client-notification-wrap .hnf-push-actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important} .hnf-client-notification-wrap .hnf-push-actions button,.hnf-client-notification-wrap .hnf-push-status{min-height:31px!important;padding:6px 11px!important;border-radius:7px!important;font-size:.67rem!important} .hnf-client-reminder-summary{font-size:.67rem!important;margin-top:8px!important;color:#a8abb8!important} .hnf-client-mobile-home{display:block!important;margin:18px 0 12px!important} .hnf-client-mobile-home>.hnf-mobile-section-title{display:none!important} .hnf-mobile-today-card{min-height:160px!important;padding:22px 210px 22px 22px!important;position:relative;overflow:hidden;background:linear-gradient(110deg,#0d1019 0%,#12101f 64%,#1e0f36 100%)!important;border:1px solid rgba(124,58,237,.30)!important;border-radius:16px!important} .hnf-mobile-today-card:after{content:"";position:absolute;right:0;top:0;width:210px;height:100%;background:linear-gradient(90deg,transparent,rgba(5,6,10,.08)),url('../assets/branding/trainer-welcome-clean.jpg') center 20%/cover no-repeat;opacity:.86;mask-image:linear-gradient(90deg,transparent 0,#000 26%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26%)} .hnf-mobile-today-card .hnf-mobile-today-copy,.hnf-mobile-today-card .hnf-mobile-start{position:relative;z-index:2} .hnf-mobile-today-card h3{font-size:1.5rem!important;margin:4px 0 7px!important} .hnf-mobile-today-card .hnf-mobile-start{margin-top:14px!important;width:auto!important;border-radius:8px!important;background:transparent!important;border:0!important;color:#a970ff!important;padding:0!important;box-shadow:none!important} .hnf-mobile-home-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important} .hnf-mobile-summary-card{min-height:108px!important;border-radius:15px!important;background:#0e111a!important;border:1px solid rgba(255,255,255,.07)!important} .hnf-mobile-week-card{border-radius:16px!important;background:#0e111a!important;border:1px solid rgba(255,255,255,.07)!important} .hnf-client-grid-4{margin-top:14px!important} .hnf-client-grid-4 .hnf-trainer-stat{min-height:92px!important;background:#0d1018!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:13px!important} .hnf-client-grid-4 .hnf-trainer-stat strong{font-size:1.8rem!important} .hnf-client-nav{margin-top:12px!important;background:#0a0c13!important;border-color:rgba(255,255,255,.065)!important} .hnf-client-nav-btn{border-radius:8px!important} .hnf-client-nav-btn.active{background:linear-gradient(90deg,#7c3aed,#5b21b6)!important;box-shadow:0 7px 20px rgba(91,33,182,.30)!important} } @media(max-width:979px){ .hnf-client-desktop-rail{display:none!important} #hnf-client-dashboard{padding-left:0!important} } @media(max-width:760px){ .hnf-client-card{background:#070910!important;border-radius:0!important} #hnf-client-dashboard{padding:0 14px 104px!important;background:radial-gradient(circle at 88% 0%,rgba(124,58,237,.11),transparent 24%),#070910!important} .hnf-client-dashboard-brand{display:none!important} .hnf-client-home-shell .hnf-trainer-head.hnf-client-premium-hero{display:block!important;padding:18px 0 10px!important;background:transparent!important;border:0!important;box-shadow:none!important;min-height:76px!important;overflow:visible!important} .hnf-client-premium-hero:before,.hnf-client-hero-photo{display:none!important} .hnf-client-hero-copy{padding-right:90px;min-height:58px} .hnf-client-welcome-back{font-size:.72rem;color:#9296a4;margin-bottom:3px} .hnf-client-premium-hero #hnf-client-welcome{font-size:1.48rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0!important} .hnf-client-premium-hero #hnf-client-goal{display:none!important} .hnf-client-mobile-head-actions{display:flex!important;position:absolute;right:0;top:2px;align-items:center;gap:9px} .hnf-client-mobile-head-actions .hnf-client-bell{position:relative;width:39px;height:39px;min-height:39px;padding:0!important;border-radius:12px!important;border:1px solid rgba(255,255,255,.08)!important;background:#0e1119!important;color:#fff!important;box-shadow:none!important;font-size:1.05rem!important} .hnf-client-mobile-head-actions img{width:39px;height:39px;border-radius:50%;object-fit:cover;object-position:center 16%;border:1px solid rgba(168,85,247,.45)} .hnf-mobile-head-badge{position:absolute;right:-3px;top:-4px;width:16px;height:16px;border-radius:999px;background:#ef4444;color:#fff;font-style:normal;font-size:.58rem;display:grid;place-items:center} .hnf-client-notification-wrap{display:none!important} .hnf-client-mobile-home{display:block!important;margin:6px 0 8px!important} .hnf-mobile-section-title{margin:5px 0 10px!important} .hnf-mobile-section-title h3{font-size:1rem!important;color:#bfc2cc!important} .hnf-mobile-home-eyebrow{font-size:.57rem!important;letter-spacing:.14em!important;color:#8757f4!important} .hnf-mobile-today-card{position:relative;min-height:156px!important;display:block!important;padding:17px 132px 17px 16px!important;border-radius:16px!important;overflow:hidden;background:linear-gradient(112deg,#0d1019 0%,#141020 64%,#241142 100%)!important;border:1px solid rgba(124,58,237,.28)!important;box-shadow:0 18px 42px rgba(0,0,0,.28)!important} .hnf-mobile-today-card:after{content:"";position:absolute;right:0;top:0;width:138px;height:100%;background:url('../assets/branding/trainer-welcome-clean.jpg') center 18%/cover no-repeat;opacity:.92;mask-image:linear-gradient(90deg,transparent,#000 26%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 26%)} .hnf-mobile-today-card .hnf-mobile-today-copy,.hnf-mobile-today-card .hnf-mobile-start{position:relative;z-index:2} .hnf-mobile-today-card .hnf-mobile-kicker{font-size:.57rem!important;letter-spacing:.13em!important;color:#b894ff!important} .hnf-mobile-today-card h3{font-size:1.22rem!important;line-height:1.08!important;margin:7px 0 6px!important} .hnf-mobile-today-card p{font-size:.68rem!important;color:#aaaeb9!important} .hnf-mobile-today-card .hnf-mobile-start{width:auto!important;display:inline-flex!important;margin-top:14px!important;padding:0!important;min-height:0!important;border:0!important;background:transparent!important;color:#a970ff!important;font-size:.72rem!important;box-shadow:none!important} .hnf-mobile-home-grid{grid-template-columns:1fr 1fr!important;gap:9px!important;margin-top:10px!important} .hnf-mobile-summary-card{min-height:104px!important;padding:13px!important;border-radius:14px!important;background:#0e1119!important;border:1px solid rgba(255,255,255,.075)!important;box-shadow:none!important} .hnf-mobile-summary-icon{font-size:.95rem!important;color:#a970ff!important} .hnf-mobile-summary-label{font-size:.62rem!important;color:#9296a4!important} .hnf-mobile-summary-card strong{font-size:1.1rem!important;margin-top:6px!important} .hnf-mobile-summary-card small{font-size:.58rem!important;color:#747987!important} .hnf-mobile-quick-actions{display:none!important} .hnf-mobile-week-card{margin-top:10px!important;padding:15px!important;border-radius:15px!important;background:#0e1119!important;border:1px solid rgba(255,255,255,.075)!important;box-shadow:none!important} .hnf-mobile-week-head h3{font-size:.92rem!important} .hnf-mobile-week-grid{grid-template-columns:1fr 1fr!important;gap:8px!important} .hnf-mobile-week-stat{padding:11px!important;border-radius:11px!important;background:#0a0d14!important} .hnf-mobile-week-stat strong{font-size:1.08rem!important;color:#fff!important} .hnf-mobile-week-stat span,.hnf-mobile-week-stat small{font-size:.57rem!important} .hnf-mobile-next-row{margin-top:9px!important;padding:11px!important;border-radius:11px!important;background:#0a0d14!important} .hnf-client-grid-4,.hnf-client-nav,#hnf-client-home-appointment{display:none!important} body>#hnf-client-bottom-nav,#hnf-client-bottom-nav{left:8px!important;right:8px!important;bottom:8px!important;width:auto!important;border:1px solid rgba(124,58,237,.28)!important;border-radius:17px!important;background:rgba(10,11,18,.96)!important;padding:7px 6px calc(7px + env(safe-area-inset-bottom))!important;box-shadow:0 14px 50px rgba(0,0,0,.48),0 0 30px rgba(91,33,182,.12)!important;overflow:hidden!important} #hnf-client-bottom-nav .hnf-client-bottom-btn{border-radius:11px!important;min-width:0!important;padding:6px 2px!important} #hnf-client-bottom-nav .hnf-client-bottom-btn.active{background:linear-gradient(145deg,#7c3aed,#5b21b6)!important;color:#fff!important} #hnf-client-bottom-nav .hnf-client-bottom-btn span{font-size:.9rem!important} #hnf-client-bottom-nav .hnf-client-bottom-btn b{font-size:.49rem!important;letter-spacing:0!important} } /* v6.4.1 Mock-up Match Phase 1.1 — Client Home refinement Desktop/mobile separation, compact program presentation and rail cleanup. */ @media (min-width:980px){ /* The client bottom dock is a phone/tablet control only. Older mobile-device fallback classes must never pin it across a desktop-width browser. */ body > #hnf-client-bottom-nav, #hnf-client-bottom-nav, html.hnf-client-mobile-device #hnf-client-bottom-nav, html.hnf-client-phone #hnf-client-bottom-nav, html.hnf-client-phone-portrait #hnf-client-bottom-nav{ display:none!important; } body{padding-bottom:0!important} /* Keep the premium rail visually intentional rather than stretching down the complete program list. */ .hnf-client-desktop-rail{ bottom:auto!important; height:720px!important; max-height:calc(100vh - 36px)!important; min-height:610px; border-radius:18px 0 18px 18px!important; box-shadow:18px 0 42px rgba(0,0,0,.12); } #hnf-client-dashboard{ padding-bottom:22px!important; } /* Give the home content a more deliberate app-dashboard rhythm. */ .hnf-client-home-shell #hnf-client-view-programs{ margin-top:18px!important; } .hnf-client-home-shell #hnf-client-view-programs>.hnf-panel-head h3{ font-size:1.08rem!important; letter-spacing:-.02em; } .hnf-client-home-shell #hnf-client-programs{ display:grid; gap:14px; } .hnf-client-home-shell .hnf-client-program-card{ border-radius:16px!important; background:linear-gradient(145deg,#0d1018,#0b0d14)!important; border:1px solid rgba(255,255,255,.075)!important; overflow:hidden; box-shadow:none!important; } .hnf-client-home-shell .hnf-client-program-card>.hnf-workout-title{ padding:17px 18px 13px!important; margin:0!important; border-bottom:1px solid rgba(255,255,255,.055); } .hnf-client-home-shell .hnf-client-program-card>.hnf-workout-title strong{ font-size:1rem!important; } .hnf-client-home-shell .hnf-client-program-card>.hnf-workout-title span{ color:#858a98!important; } .hnf-client-home-shell .hnf-client-program-card .hnf-workout-items{ padding:8px!important; } .hnf-client-home-shell .hnf-client-program-card .hnf-workout-item{ min-height:58px!important; border-radius:10px!important; background:rgba(255,255,255,.018)!important; border:1px solid transparent!important; margin:0!important; } .hnf-client-home-shell .hnf-client-program-card .hnf-workout-item:hover{ background:rgba(124,58,237,.08)!important; border-color:rgba(139,92,246,.22)!important; } } @media (min-width:1180px){ /* Long multi-week plans become a compact two-column library on Home. This reduces the page height without changing workout opening logic. */ .hnf-client-home-shell .hnf-client-program-card:not(.hnf-quick-client-card) .hnf-workout-items{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:6px!important; } } @media (min-width:761px) and (max-width:979px){ /* Tablet/compact desktop keeps the dashboard content full width and only shows the dock when the runtime has positively identified a mobile device. */ #hnf-client-dashboard{padding-left:0!important} html:not(.hnf-client-mobile-device):not(.hnf-client-phone):not(.hnf-client-phone-portrait) #hnf-client-bottom-nav, html:not(.hnf-client-mobile-device):not(.hnf-client-phone):not(.hnf-client-phone-portrait) body > #hnf-client-bottom-nav{ display:none!important; } } @media (max-width:760px){ /* Slightly tighter Home hierarchy for the mock-up-style mobile surface. */ #hnf-client-dashboard{padding-top:2px!important} .hnf-client-premium-hero #hnf-client-welcome{letter-spacing:-.028em!important} .hnf-mobile-today-card{margin-top:2px!important} .hnf-mobile-week-card{margin-bottom:4px!important} #hnf-client-view-programs{margin-top:15px!important} #hnf-client-view-programs>.hnf-panel-head{display:flex!important;margin:0 2px 8px!important} #hnf-client-view-programs>.hnf-panel-head h3{font-size:.98rem!important} .hnf-client-program-card{border-radius:15px!important;overflow:hidden!important} .hnf-client-program-card .hnf-workout-item{min-height:58px!important} } /* v6.4.2 Mock-up Match Phase 1.2 — Responsive shell lock One navigation system at a time: desktop rail above 1100px, compact bottom dock at 1100px and below. This is intentionally viewport-led so desktop-mode mobile browsers and DeX cannot force both navigation systems on screen. */ @media (max-width:1100px){ #hnf-client-dashboard{padding-left:0!important} .hnf-client-desktop-rail{display:none!important} html.hnf-client-mobile-device #hnf-client-bottom-nav, html.hnf-client-phone #hnf-client-bottom-nav, #hnf-client-bottom-nav{ display:grid!important; } } @media (min-width:1101px){ #hnf-client-dashboard{padding-left:188px!important} .hnf-client-desktop-rail{display:flex!important} body > #hnf-client-bottom-nav, #hnf-client-bottom-nav, html.hnf-client-mobile-device #hnf-client-bottom-nav, html.hnf-client-phone #hnf-client-bottom-nav, html.hnf-client-phone-portrait #hnf-client-bottom-nav{ display:none!important; visibility:hidden!important; pointer-events:none!important; } } /* Compact/tablet presentation: preserve the premium photo hero while making the controls breathe like an app instead of a squeezed desktop page. */ @media (min-width:761px) and (max-width:1100px){ #hnf-client-dashboard{padding:0 18px 104px!important} .hnf-client-home-shell .hnf-trainer-head.hnf-client-premium-hero{ min-height:218px!important; padding:24px 260px 22px 24px!important; border-radius:17px!important; } .hnf-client-premium-hero #hnf-client-welcome{font-size:1.85rem!important} .hnf-client-hero-photo{display:block!important;right:-18px!important;bottom:-132px!important;width:300px!important;height:395px!important} .hnf-client-notification-wrap{max-width:520px!important;margin-top:14px!important} .hnf-client-notification-wrap .hnf-push-actions{gap:6px!important} .hnf-client-notification-wrap .hnf-push-actions button, .hnf-client-notification-wrap .hnf-push-status{font-size:.63rem!important;padding:6px 9px!important;min-height:30px!important} .hnf-client-mobile-home{margin-top:14px!important} .hnf-mobile-today-card{min-height:146px!important;padding-right:185px!important} .hnf-mobile-today-card:after{width:190px!important} } @media (max-width:760px){ /* Final phone tightening: no desktop rail, smaller top controls, cleaner hero. */ .hnf-client-desktop-rail{display:none!important} .hnf-client-home-shell .hnf-trainer-head.hnf-client-premium-hero{padding-top:12px!important} .hnf-client-hero-copy{padding-right:82px!important;min-height:52px!important} .hnf-client-mobile-head-actions{top:0!important;gap:7px!important} .hnf-client-mobile-head-actions .hnf-client-bell, .hnf-client-mobile-head-actions img{width:36px!important;height:36px!important;min-height:36px!important} .hnf-mobile-today-card{min-height:146px!important;padding:15px 124px 15px 15px!important} .hnf-mobile-today-card:after{width:128px!important} } /* v6.4.3 Mock-up Match Phase 2 — Client Workouts Premium training surface. Existing schedule/session logic is unchanged. */ .hnf-workouts-feature-hero{display:none} .hnf-mobile-workout-meta,.hnf-mobile-workout-progress{display:none} @media (max-width:1100px){ #hnf-client-view-workouts{padding-bottom:102px!important} #hnf-client-view-workouts .hnf-mobile-subscreen-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;margin:2px 0 12px!important} #hnf-client-view-workouts .hnf-mobile-subscreen-head h2{margin:2px 0 0!important;font-size:1.55rem!important;letter-spacing:-.035em!important} #hnf-client-view-workouts .hnf-mobile-subscreen-head button{display:none!important} #hnf-client-view-workouts .hnf-mobile-workouts-overview{display:block!important} #hnf-client-view-workouts .hnf-desktop-workout-head, #hnf-client-view-workouts>#hnf-client-workouts{display:none!important} .hnf-workouts-feature-hero{display:grid!important;grid-template-columns:minmax(0,1fr) 145px;min-height:178px;margin:0 0 14px;padding:20px;border:1px solid rgba(139,92,246,.26);border-radius:20px;background:radial-gradient(circle at 92% 10%,rgba(124,58,237,.32),transparent 42%),linear-gradient(145deg,#10101a,#090b12 70%);overflow:hidden;position:relative} .hnf-workouts-feature-copy{position:relative;z-index:2;align-self:center;min-width:0} .hnf-workouts-feature-copy h3{margin:5px 0 8px!important;font-size:1.55rem!important;line-height:1.03!important;letter-spacing:-.045em!important;color:#fff!important} .hnf-workouts-feature-copy p{max-width:390px;margin:0!important;color:#a0a4b1!important;font-size:.72rem!important;line-height:1.5!important} .hnf-workouts-feature-mark{align-self:center;justify-self:center;width:110px;height:110px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,rgba(139,92,246,.2),rgba(91,33,182,.05));border:1px solid rgba(169,120,255,.38);box-shadow:0 0 45px rgba(124,58,237,.18),inset 0 0 30px rgba(124,58,237,.08)} .hnf-workouts-feature-mark span{font-size:1.8rem;font-weight:900;line-height:1;color:#fff;letter-spacing:-.07em} .hnf-workouts-feature-mark small{margin-top:6px;color:#bfa7ff;font-size:.47rem;font-weight:900;letter-spacing:.22em} .hnf-mobile-workouts-head{margin:4px 2px 9px!important;align-items:flex-end!important} .hnf-mobile-workouts-head h3{font-size:1.02rem!important;letter-spacing:-.025em!important} .hnf-mobile-date{font-size:.62rem!important;color:#7e8391!important} .hnf-mobile-workout-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;margin:0 0 16px!important} .hnf-mobile-workout-summary>div{min-height:86px!important;padding:13px!important;border-radius:14px!important;background:#0e1119!important;border:1px solid rgba(255,255,255,.075)!important} .hnf-mobile-workout-summary span{font-size:.58rem!important;text-transform:uppercase!important;letter-spacing:.07em!important;color:#858a98!important} .hnf-mobile-workout-summary strong{margin-top:5px!important;font-size:1.55rem!important;line-height:1!important;color:#fff!important} .hnf-mobile-workout-section{margin:0 0 18px!important} .hnf-mobile-workout-section-head{margin:0 2px 8px!important} .hnf-mobile-workout-section-head h4{font-size:.91rem!important;letter-spacing:-.015em!important} .hnf-mobile-workout-section-head span{min-width:26px;height:24px;padding:0 8px;border-radius:999px;background:#181426!important;border:1px solid rgba(139,92,246,.25)!important;color:#bfa7ff!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:.61rem!important;font-weight:800!important} .hnf-mobile-workout-stack{display:grid!important;gap:9px!important} .hnf-mobile-workout-card{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding:15px!important;border-radius:16px!important;border:1px solid rgba(255,255,255,.075)!important;background:linear-gradient(145deg,#11131c,#0c0f16)!important;box-shadow:none!important} .hnf-mobile-workout-card.is-completed{opacity:1!important;background:linear-gradient(145deg,#0d1514,#0c1014)!important;border-color:rgba(49,196,141,.15)!important} .hnf-mobile-workout-card-main{min-width:0!important} .hnf-mobile-workout-status{display:inline-flex!important;align-items:center!important;min-height:21px!important;padding:3px 7px!important;border-radius:999px!important;background:rgba(124,58,237,.13)!important;border:1px solid rgba(139,92,246,.22)!important;color:#bfa7ff!important;font-size:.47rem!important;font-weight:900!important;letter-spacing:.08em!important} .hnf-mobile-workout-card.is-completed .hnf-mobile-workout-status{background:rgba(22,163,116,.12)!important;border-color:rgba(49,196,141,.2)!important;color:#6ee7b7!important} .hnf-mobile-workout-card h4{margin:8px 0 3px!important;font-size:1rem!important;letter-spacing:-.025em!important;color:#fff!important} .hnf-mobile-workout-card p{margin:0!important;font-size:.65rem!important;color:#858a98!important} .hnf-mobile-workout-meta{display:flex!important;gap:10px!important;margin-top:9px!important;color:#a0a4b1!important;font-size:.55rem!important} .hnf-mobile-workout-meta span+span:before{content:'•';margin-right:10px;color:#5f6470} .hnf-mobile-workout-progress{display:block!important;height:4px!important;margin-top:8px!important;border-radius:999px!important;overflow:hidden!important;background:#20232c!important} .hnf-mobile-workout-progress i{display:block!important;height:100%!important;border-radius:inherit!important;background:linear-gradient(90deg,#7c3aed,#a970ff)!important} .hnf-mobile-workout-card.is-completed .hnf-mobile-workout-progress i{background:#31c48d!important} .hnf-mobile-workout-card-actions{align-self:stretch!important;display:flex!important;align-items:center!important} .hnf-mobile-open-workout{min-height:42px!important;padding:0 12px!important;border-radius:11px!important;background:#7c3aed!important;border:1px solid #8b5cf6!important;color:#fff!important;font-size:.61rem!important;font-weight:800!important;white-space:nowrap!important;box-shadow:none!important} .hnf-mobile-workout-card.is-completed .hnf-mobile-open-workout{background:transparent!important;border-color:rgba(49,196,141,.28)!important;color:#6ee7b7!important} .hnf-mobile-workout-empty{padding:18px!important;border-radius:14px!important;border:1px dashed rgba(255,255,255,.09)!important;background:#0c0f16!important;color:#777c89!important;text-align:center!important;font-size:.68rem!important} } @media (max-width:560px){ .hnf-workouts-feature-hero{grid-template-columns:minmax(0,1fr) 92px!important;min-height:155px!important;padding:17px!important;border-radius:17px!important} .hnf-workouts-feature-copy h3{font-size:1.35rem!important} .hnf-workouts-feature-copy p{font-size:.63rem!important;max-width:245px!important} .hnf-workouts-feature-mark{width:78px!important;height:78px!important} .hnf-workouts-feature-mark span{font-size:1.35rem!important} .hnf-workouts-feature-mark small{font-size:.38rem!important} .hnf-mobile-workout-summary>div{min-height:77px!important;padding:11px!important} .hnf-mobile-workout-summary strong{font-size:1.35rem!important} .hnf-mobile-workout-card{grid-template-columns:1fr!important;gap:10px!important} .hnf-mobile-workout-card-actions{display:block!important} .hnf-mobile-open-workout{width:100%!important;justify-content:center!important} } @media (min-width:1101px){ /* Desktop workouts use the same premium card language while retaining the full existing schedule/detail renderer. */ #hnf-client-view-workouts>.hnf-mobile-subscreen-head, #hnf-client-view-workouts>.hnf-mobile-workouts-overview{display:none!important} #hnf-client-view-workouts .hnf-desktop-workout-head{display:flex!important;margin:0 0 12px!important;padding:0!important} #hnf-client-view-workouts .hnf-desktop-workout-head h3{font-size:1.15rem!important;letter-spacing:-.025em!important} #hnf-client-view-workouts>#hnf-client-workouts{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px!important} #hnf-client-view-workouts>#hnf-client-workouts>.hnf-client-workout-card{margin:0!important;padding:16px!important;border-radius:17px!important;background:linear-gradient(145deg,#10131b,#0c0f16)!important;border:1px solid rgba(255,255,255,.075)!important;box-shadow:none!important} #hnf-client-view-workouts .hnf-client-workout-card>.hnf-workout-title{align-items:flex-start!important;gap:12px!important;margin-bottom:11px!important} #hnf-client-view-workouts .hnf-client-workout-card>.hnf-workout-title strong{font-size:1.02rem!important;letter-spacing:-.02em!important} #hnf-client-view-workouts .hnf-client-workout-card>.hnf-workout-title span{color:#858a98!important;font-size:.64rem!important} #hnf-client-view-workouts .hnf-client-exercise{border-radius:12px!important;background:#0c0f16!important;border-color:rgba(255,255,255,.065)!important} } /* v6.4.4 Workouts desktop cleanup — keep the overview compact and render detailed exercise logging only after a workout is selected. */ @media (min-width:1101px){ #hnf-client-view-workouts>#hnf-client-workouts{display:block!important} .hnf-desktop-workout-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .hnf-desktop-workout-overview .hnf-mobile-workout-card{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:14px!important;padding:17px!important;border-radius:17px!important;background:linear-gradient(145deg,#10131b,#0c0f16)!important;border:1px solid rgba(255,255,255,.075)!important} .hnf-desktop-workout-overview .hnf-mobile-workout-status{display:inline-flex!important;align-items:center!important;padding:3px 8px!important;border-radius:999px!important;background:rgba(124,58,237,.13)!important;border:1px solid rgba(139,92,246,.22)!important;color:#bfa7ff!important;font-size:.52rem!important;font-weight:900!important;letter-spacing:.08em!important} .hnf-desktop-workout-overview .hnf-mobile-workout-card.is-completed .hnf-mobile-workout-status{background:rgba(22,163,116,.12)!important;border-color:rgba(49,196,141,.2)!important;color:#6ee7b7!important} .hnf-desktop-workout-overview .hnf-mobile-workout-card h4{margin:8px 0 4px!important;font-size:1rem!important;color:#fff!important} .hnf-desktop-workout-overview .hnf-mobile-workout-card p{margin:0!important;color:#858a98!important;font-size:.66rem!important} .hnf-desktop-workout-overview .hnf-mobile-workout-meta{display:flex!important;gap:10px!important;margin-top:9px!important;color:#a0a4b1!important;font-size:.57rem!important} .hnf-desktop-workout-overview .hnf-mobile-workout-progress{display:block!important;height:4px!important;margin-top:8px!important;border-radius:999px!important;overflow:hidden!important;background:#20232c!important} .hnf-desktop-workout-overview .hnf-mobile-workout-progress i{display:block!important;height:100%!important;background:linear-gradient(90deg,#7c3aed,#a970ff)!important} .hnf-desktop-workout-overview .is-completed .hnf-mobile-workout-progress i{background:#31c48d!important} .hnf-desktop-workout-overview .hnf-mobile-open-workout{min-height:40px!important;padding:0 13px!important;border-radius:10px!important;background:#7c3aed!important;border:1px solid #8b5cf6!important;color:#fff!important;font-size:.62rem!important;font-weight:800!important;white-space:nowrap!important} .hnf-desktop-workout-overview .is-completed .hnf-mobile-open-workout{background:transparent!important;border-color:rgba(49,196,141,.28)!important;color:#6ee7b7!important} .hnf-desktop-workout-detail-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;padding:10px 12px;border:1px solid rgba(139,92,246,.2);border-radius:12px;background:#0c0f16} .hnf-desktop-workout-detail-head button{min-height:38px;padding:0 12px;border-radius:9px;border:1px solid rgba(139,92,246,.35);background:#171225;color:#d6c8ff;font-weight:800} .hnf-desktop-workout-detail-head span{font-size:.56rem;font-weight:900;letter-spacing:.14em;color:#8d7bb9} #hnf-client-workouts>.hnf-client-workout-card{max-width:none!important;margin:0!important} } /* v6.4.5 Mock-up Match — Client Nutrition / Meal Planner */ .hnf-nutrition-feature-hero{ position:relative!important; overflow:hidden!important; display:grid!important; grid-template-columns:minmax(0,1fr) 128px!important; align-items:center!important; gap:18px!important; min-height:178px!important; margin:0 0 13px!important; padding:22px 24px!important; border:1px solid rgba(139,92,246,.28)!important; border-radius:19px!important; background:radial-gradient(circle at 88% 26%,rgba(139,92,246,.32),transparent 32%),linear-gradient(135deg,#121022 0%,#0c0f17 60%,#180d2b 100%)!important; } .hnf-nutrition-feature-hero:after{ content:"";position:absolute;inset:auto -45px -90px auto;width:230px;height:230px;border-radius:50%; border:1px solid rgba(168,85,247,.16);box-shadow:0 0 0 24px rgba(139,92,246,.025),0 0 0 50px rgba(139,92,246,.018);pointer-events:none; } .hnf-nutrition-feature-copy{position:relative;z-index:2;min-width:0!important} .hnf-nutrition-feature-copy h3{margin:5px 0 7px!important;color:#fff!important;font-size:1.72rem!important;line-height:1.02!important;letter-spacing:-.045em!important} .hnf-nutrition-feature-copy p{max-width:520px!important;margin:0!important;color:#9da1ae!important;font-size:.72rem!important;line-height:1.55!important} .hnf-nutrition-feature-mark{position:relative;z-index:2;justify-self:end;width:104px;height:104px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(168,85,247,.42);background:radial-gradient(circle at 36% 28%,rgba(168,85,247,.26),rgba(27,18,52,.72) 48%,rgba(10,12,20,.95));box-shadow:inset 0 0 28px rgba(124,58,237,.18),0 15px 35px rgba(0,0,0,.25)} .hnf-nutrition-feature-mark span{font-size:1.55rem;font-weight:950;letter-spacing:-.06em;color:#fff} .hnf-nutrition-feature-mark small{margin-top:1px;color:#bca7ff;font-size:.48rem;font-weight:900;letter-spacing:.14em} .hnf-client-nutrition-content{gap:13px!important} .hnf-client-nutrition-hero{padding:18px!important;border-radius:17px!important;background:linear-gradient(145deg,#11131c,#0d0f17)!important;border:1px solid rgba(255,255,255,.075)!important;box-shadow:none!important} .hnf-client-nutrition-hero h3{font-size:1.25rem!important;letter-spacing:-.03em!important} .hnf-client-nutrition-hero>p,.hnf-client-nutrition-hero-top p{color:#8f94a1!important;font-size:.66rem!important} .hnf-client-nutrition-hero-actions{display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:wrap!important;justify-content:flex-end!important} .hnf-client-export-meal-plan{min-height:31px!important;padding:0 10px!important;border-radius:8px!important;font-size:.59rem!important;background:#17131f!important;border:1px solid rgba(139,92,246,.25)!important;color:#d5c6ff!important} .hnf-client-nutrition-macros{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important;margin:14px 0 10px!important} .hnf-client-nutrition-macros>div{min-height:78px!important;padding:12px!important;border-radius:12px!important;background:#0d1018!important;border:1px solid rgba(255,255,255,.07)!important} .hnf-client-nutrition-macros span{font-size:.55rem!important;text-transform:uppercase!important;letter-spacing:.065em!important;color:#777d8b!important} .hnf-client-nutrition-macros strong{margin-top:7px!important;font-size:1.05rem!important;color:#fff!important} .hnf-client-nutrition-macros>div small{font-size:.5rem!important;color:#676d79!important} .hnf-client-nutrition-plan-meta{gap:9px!important;margin-top:10px!important} .hnf-client-nutrition-plan-meta>div{min-height:58px!important;padding:10px 11px!important;border-radius:11px!important;background:#0b0e15!important;border-color:rgba(255,255,255,.06)!important} .hnf-client-nutrition-plan-meta span{font-size:.52rem!important;text-transform:uppercase!important;letter-spacing:.055em!important} .hnf-client-nutrition-plan-meta strong{font-size:.72rem!important} .hnf-client-nutrition-note{margin-top:11px!important;padding:11px 12px!important;border-radius:10px!important;background:rgba(124,58,237,.055)!important;border-left:2px solid #7c3aed!important} .hnf-client-nutrition-today{margin:0!important;padding:14px!important;border-radius:14px!important;background:linear-gradient(135deg,rgba(124,58,237,.10),rgba(14,17,25,.92))!important;border-color:rgba(139,92,246,.25)!important} .hnf-client-nutrition-today-copy strong{font-size:.76rem!important} .hnf-client-nutrition-today-copy>b{font-size:1.35rem!important;letter-spacing:-.04em!important} .hnf-client-nutrition-today-track{height:6px!important;background:#24232c!important} .hnf-client-nutrition-today-track i{background:linear-gradient(90deg,#7c3aed,#a970ff)!important} .hnf-client-nutrition-today>small{font-size:.55rem!important;color:#777c89!important} .hnf-client-nutrition-section-head{margin:4px 2px 2px!important} .hnf-client-nutrition-section-head h3{font-size:1.03rem!important;letter-spacing:-.025em!important} .hnf-client-meal-days{display:grid!important;gap:10px!important} .hnf-client-meal-day{margin:0!important;border-radius:15px!important;background:#0e1119!important;border:1px solid rgba(255,255,255,.075)!important;overflow:hidden!important} .hnf-client-meal-day>summary{min-height:60px!important;padding:12px 14px!important;background:linear-gradient(90deg,#10131b,#0d1017)!important} .hnf-client-meal-day-title span{font-size:.51rem!important} .hnf-client-meal-day-title strong{font-size:.78rem!important} .hnf-client-meal-day-summary{font-size:.58rem!important} .hnf-client-day-macro-summary{padding:0 13px 10px!important} .hnf-client-day-macro-summary span{background:#171822!important;color:#a8adba!important;font-size:.52rem!important} .hnf-client-meal-list{gap:8px!important;padding:0 10px 10px!important} .hnf-client-meal-card{padding:12px!important;border-radius:13px!important;background:#0a0d14!important;border-color:rgba(255,255,255,.065)!important} .hnf-client-meal-index{background:rgba(124,58,237,.15)!important;border:1px solid rgba(139,92,246,.22)!important;color:#c8b4ff!important} .hnf-client-meal-card h4{font-size:.86rem!important;letter-spacing:-.015em!important} .hnf-client-meal-card-head span{font-size:.49rem!important;letter-spacing:.075em!important} .hnf-client-meal-card-head>b{font-size:.58rem!important;color:#d5c8ff!important} .hnf-client-meal-card>p{margin:7px 0!important;color:#aaaeba!important;font-size:.63rem!important;line-height:1.5!important} .hnf-client-meal-macro-row span{padding:4px 7px!important;background:#151821!important;color:#a8adba!important;font-size:.52rem!important} .hnf-meal-complete{margin-top:10px!important;min-height:36px!important;border-radius:9px!important;font-size:.58rem!important;font-weight:850!important;background:#7c3aed!important;border:1px solid #8b5cf6!important;color:#fff!important} .hnf-meal-complete.is-done{background:rgba(22,163,116,.09)!important;border-color:rgba(49,196,141,.28)!important;color:#6ee7b7!important} .hnf-meal-complete:disabled{background:#11141b!important;border-color:rgba(255,255,255,.065)!important;color:#626875!important;opacity:1!important} @media (min-width:1101px){ #hnf-client-view-nutrition>.hnf-mobile-subscreen-head{display:none!important} .hnf-client-nutrition-screen{padding-top:0!important} .hnf-client-nutrition-content{max-width:none!important} .hnf-client-meal-days{grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:start!important} .hnf-client-meal-day:first-child:nth-last-child(1){grid-column:1/-1!important} } @media (max-width:1100px){ .hnf-nutrition-feature-hero{grid-template-columns:minmax(0,1fr) 100px!important;min-height:160px!important;padding:19px!important} .hnf-nutrition-feature-mark{width:88px;height:88px!important} } @media (max-width:760px){ #hnf-client-view-nutrition{padding:0 0 18px!important;background:#070910!important} #hnf-client-view-nutrition>.hnf-mobile-subscreen-head{margin:0 0 11px!important;padding:8px 0 0!important} #hnf-client-view-nutrition>.hnf-mobile-subscreen-head button{display:none!important} .hnf-nutrition-feature-hero{grid-template-columns:minmax(0,1fr) 78px!important;min-height:142px!important;margin:0 0 10px!important;padding:16px!important;border-radius:17px!important} .hnf-nutrition-feature-copy h3{font-size:1.34rem!important} .hnf-nutrition-feature-copy p{font-size:.61rem!important;line-height:1.45!important} .hnf-nutrition-feature-mark{width:70px!important;height:70px!important} .hnf-nutrition-feature-mark span{font-size:1.12rem!important} .hnf-nutrition-feature-mark small{font-size:.34rem!important} .hnf-client-nutrition-hero{padding:13px!important;border-radius:15px!important} .hnf-client-nutrition-hero-top{gap:9px!important} .hnf-client-nutrition-hero h3{font-size:1.02rem!important} .hnf-client-nutrition-hero-actions{max-width:112px!important} .hnf-client-export-meal-plan{min-height:28px!important;padding:0 8px!important;font-size:.52rem!important} .hnf-client-nutrition-macros{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important} .hnf-client-nutrition-macros>div{min-height:67px!important;padding:10px!important} .hnf-client-nutrition-macros strong{font-size:.92rem!important} .hnf-client-nutrition-plan-meta{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important} .hnf-client-nutrition-plan-meta>div{padding:8px!important;min-height:52px!important} .hnf-client-nutrition-today{padding:12px!important} .hnf-client-nutrition-today-copy>b{font-size:1.12rem!important} .hnf-client-meal-days{grid-template-columns:1fr!important} .hnf-client-meal-card{grid-template-columns:25px minmax(0,1fr)!important;padding:10px!important} .hnf-client-meal-card>p{font-size:.59rem!important} } /* v6.4.6 Mock-up Match — Client Progress */ #hnf-client-view-progress{--hnf-progress-surface:#0d1018;--hnf-progress-border:rgba(255,255,255,.075)} .hnf-mobile-progress-dashboard{position:relative!important;margin:0 0 13px!important;padding:0!important} .hnf-mobile-progress-dashboard:before{content:"PROGRESS COACHING";display:block;margin:0 0 7px;color:#a78bfa;font-size:.54rem;font-weight:900;letter-spacing:.14em} .hnf-mobile-progress-hero{min-height:164px!important;padding:22px!important;border:1px solid rgba(139,92,246,.3)!important;border-radius:19px!important;background:radial-gradient(circle at 90% 22%,rgba(139,92,246,.34),transparent 30%),linear-gradient(135deg,#11101f,#0b0e16 62%,#180d2b)!important;box-shadow:none!important;overflow:hidden!important} .hnf-mobile-progress-hero strong{font-size:2.35rem!important;letter-spacing:-.06em!important;color:#fff!important}.hnf-mobile-progress-hero small{color:#8f95a3!important}.hnf-mobile-progress-hero-delta{max-width:180px!important;padding:9px 11px!important;border:1px solid rgba(139,92,246,.24)!important;border-radius:10px!important;background:rgba(11,13,21,.7)!important;color:#c7b9ee!important;font-size:.62rem!important} .hnf-mobile-progress-metrics{gap:9px!important;margin:10px 0!important}.hnf-mobile-progress-metrics>div{min-height:82px!important;padding:12px!important;border-radius:13px!important;background:#0d1018!important;border:1px solid var(--hnf-progress-border)!important}.hnf-mobile-progress-metrics span{color:#777d8b!important;font-size:.54rem!important;text-transform:uppercase!important;letter-spacing:.055em!important}.hnf-mobile-progress-metrics strong{font-size:1.12rem!important;color:#fff!important}.hnf-mobile-progress-metrics small{font-size:.51rem!important;color:#777d8b!important} .hnf-mobile-progress-actions{gap:9px!important;margin:0 0 13px!important}.hnf-mobile-progress-actions button{min-height:48px!important;border-radius:11px!important;background:#151122!important;border:1px solid rgba(139,92,246,.28)!important;color:#eee8ff!important}.hnf-mobile-progress-actions button span{color:#a78bfa!important}.hnf-mobile-progress-actions button b{font-size:.62rem!important} #hnf-client-view-progress .hnf-progress-card{margin:0 0 11px!important;padding:16px!important;border-radius:15px!important;background:var(--hnf-progress-surface)!important;border:1px solid var(--hnf-progress-border)!important;box-shadow:none!important} #hnf-client-view-progress .hnf-progress-card h3{font-size:.96rem!important;letter-spacing:-.02em!important;color:#fff!important}#hnf-client-view-progress .hnf-panel-head{margin-bottom:11px!important}#hnf-client-view-progress .hnf-mobile-section-copy{color:#7f8592!important;font-size:.58rem!important} .hnf-progress-columns{gap:11px!important}.hnf-progress-form-grid{gap:8px!important}.hnf-progress-form-grid input,#hnf-client-view-progress textarea,#hnf-client-view-progress select,#hnf-client-view-progress input[type=date],#hnf-client-view-progress input[type=file]{min-height:40px!important;border-radius:9px!important;background:#090c13!important;border:1px solid rgba(255,255,255,.085)!important;color:#e7e8ed!important;font-size:.62rem!important}#hnf-progress-save,#hnf-photo-save{min-height:40px!important;border-radius:9px!important;background:#7c3aed!important;border:1px solid #8b5cf6!important;color:#fff!important;font-weight:850!important} #hnf-client-targets .hnf-goal-card,.hnf-progress-summary>div{border-radius:11px!important;background:#090c13!important;border:1px solid rgba(255,255,255,.065)!important}.hnf-trend-grid{gap:9px!important}.hnf-trend-grid>div{padding:12px!important;border-radius:12px!important;background:#090c13!important;border:1px solid rgba(255,255,255,.065)!important} .hnf-progress-insights-card{border-color:rgba(139,92,246,.22)!important}.hnf-progress-insights-summary{gap:8px!important}.hnf-progress-insights-summary>div{border-radius:10px!important;background:#090c13!important;border-color:rgba(255,255,255,.065)!important}.hnf-progress-insights-controls button{border-radius:8px!important}.hnf-client-photo-compare-card{border-color:rgba(139,92,246,.22)!important}.hnf-photo-grid img{border-radius:11px!important} @media (min-width:1101px){#hnf-client-view-progress>.hnf-mobile-subscreen-head{display:none!important}#hnf-client-view-progress{padding-top:0!important}.hnf-mobile-progress-dashboard{display:grid!important;grid-template-columns:1.35fr .85fr!important;gap:10px!important;align-items:stretch!important}.hnf-mobile-progress-dashboard:before{grid-column:1/-1!important;margin-bottom:-2px!important}.hnf-mobile-progress-hero{grid-row:2/4!important}.hnf-mobile-progress-metrics{grid-column:2!important;grid-row:2!important;margin:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}.hnf-mobile-progress-actions{grid-column:2!important;grid-row:3!important;margin:0!important}.hnf-progress-columns{display:grid!important;grid-template-columns:1fr 1fr!important}.hnf-mobile-overview-card,.hnf-progress-insights-card{padding:18px!important}} @media (max-width:760px){#hnf-client-view-progress{padding:0 0 18px!important;background:#070910!important}#hnf-client-view-progress>.hnf-mobile-subscreen-head{margin:0 0 10px!important;padding:8px 0 0!important}#hnf-client-view-progress>.hnf-mobile-subscreen-head button{display:none!important}.hnf-mobile-progress-hero{min-height:146px!important;padding:17px!important}.hnf-mobile-progress-hero strong{font-size:2rem!important}.hnf-mobile-progress-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important}.hnf-mobile-progress-metrics>div{min-height:74px!important;padding:10px!important}.hnf-mobile-progress-actions{grid-template-columns:1fr 1fr!important}#hnf-client-view-progress .hnf-progress-card{padding:13px!important}.hnf-progress-form-grid{grid-template-columns:1fr 1fr!important}.hnf-progress-insights-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}} /* ========================================================= v6.4.7 Mock-up Match — Client Calendar ========================================================= */ #hnf-client-view-calendar.hnf-client-calendar-screen{ gap:16px!important; } .hnf-calendar-premium-hero{ position:relative!important; overflow:hidden!important; display:grid!important; grid-template-columns:minmax(0,1fr) 120px!important; align-items:center!important; gap:18px!important; padding:24px!important; border:1px solid rgba(139,92,246,.34)!important; border-radius:18px!important; background: radial-gradient(circle at 90% 18%,rgba(139,92,246,.28),transparent 34%), linear-gradient(135deg,#0d0d16 0%,#11101c 62%,#241148 100%)!important; } .hnf-calendar-premium-hero:after{ content:"";position:absolute;right:-72px;bottom:-90px;width:220px;height:220px;border-radius:50%; border:1px solid rgba(167,139,250,.12);box-shadow:0 0 0 26px rgba(139,92,246,.035),0 0 0 52px rgba(139,92,246,.025); pointer-events:none; } .hnf-calendar-hero-copy{position:relative;z-index:1;min-width:0} .hnf-calendar-hero-copy h3{margin:7px 0 7px!important;font-size:26px!important;line-height:1!important;letter-spacing:-.03em!important} .hnf-calendar-hero-copy p{margin:0!important;max-width:560px!important;color:#aaa4b2!important;font-size:12px!important;line-height:1.55!important} .hnf-calendar-hero-mark{ position:relative;z-index:1;justify-self:end;display:flex;flex-direction:column;align-items:center;justify-content:center; width:92px;height:92px;border-radius:50%;border:1px solid rgba(167,139,250,.48);background:rgba(46,22,86,.46); box-shadow:inset 0 0 28px rgba(139,92,246,.18); } .hnf-calendar-hero-mark strong{font-size:22px;line-height:1;color:#fff}.hnf-calendar-hero-mark span{margin-top:6px;font-size:7px;font-weight:900;letter-spacing:.16em;color:#b9a6ff} .hnf-client-calendar-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important} .hnf-client-calendar-stats>div{padding:14px 15px!important;border:1px solid #292735!important;border-radius:14px!important;background:#111118!important} .hnf-client-calendar-stats span,.hnf-client-calendar-stats strong,.hnf-client-calendar-stats small{display:block!important} .hnf-client-calendar-stats span{color:#9874ff!important;font-size:8px!important;font-weight:900!important;letter-spacing:.14em!important} .hnf-client-calendar-stats strong{margin-top:7px!important;color:#fff!important;font-size:24px!important;line-height:1!important} .hnf-client-calendar-stats small{margin-top:4px!important;color:#85808d!important;font-size:9px!important} .hnf-client-next-appointment{padding:17px 18px!important;border-radius:15px!important;border:1px solid rgba(139,92,246,.3)!important;background:linear-gradient(120deg,#111118,#171221)!important} .hnf-client-next-appointment.has-appointment{box-shadow:inset 3px 0 0 #8b5cf6!important} .hnf-next-appointment-copy strong{font-size:16px!important}.hnf-next-appointment-time{font-size:14px!important;font-weight:900!important;color:#d8ccff!important} .hnf-client-calendar-controls{padding:8px 0 0!important} .hnf-client-calendar-controls button{min-width:42px!important;border-radius:10px!important} .hnf-client-calendar-view-toggle{padding:4px!important;border:1px solid #272631!important;border-radius:12px!important;background:#0e0e14!important} .hnf-client-calendar-view-toggle button{border:0!important;border-radius:9px!important;background:transparent!important} .hnf-client-calendar-view-toggle button.is-active,.hnf-client-calendar-view-toggle button[aria-pressed="true"]{background:linear-gradient(135deg,#6d36db,#8b5cf6)!important;box-shadow:0 7px 22px rgba(124,58,237,.18)!important} .hnf-client-calendar-agenda{border:1px solid #292735!important;border-radius:16px!important;background:#101017!important} .hnf-client-agenda-head{padding-bottom:12px!important;border-bottom:1px solid #292735!important} .hnf-client-agenda-item{border:1px solid #292832!important;border-left:3px solid #8b5cf6!important;border-radius:12px!important;background:#14141c!important} .hnf-client-agenda-item.is-google{border-left-color:#8b5cf6!important;background:linear-gradient(90deg,rgba(124,58,237,.1),#14141c 38%)!important} .hnf-client-agenda-item.is-nutrition{border-left-color:#22c55e!important}.hnf-client-agenda-item.is-checkin{border-left-color:#3b82f6!important} @media(min-width:1101px){ #hnf-client-view-calendar{max-width:none!important} #hnf-client-view-calendar .hnf-client-calendar-month-view{border-radius:16px!important} #hnf-client-view-calendar .hnf-client-calendar-days{min-width:0!important} #hnf-client-view-calendar .hnf-client-calendar-weekdays{min-width:0!important} } @media(max-width:900px){ .hnf-calendar-premium-hero{grid-template-columns:minmax(0,1fr) 78px!important;padding:18px!important;border-radius:16px!important} .hnf-calendar-hero-copy h3{font-size:23px!important}.hnf-calendar-hero-copy p{font-size:11px!important} .hnf-calendar-hero-mark{width:68px;height:68px}.hnf-calendar-hero-mark strong{font-size:18px}.hnf-calendar-hero-mark span{font-size:6px} .hnf-client-calendar-stats{gap:7px!important}.hnf-client-calendar-stats>div{padding:12px 10px!important}.hnf-client-calendar-stats strong{font-size:21px!important} } @media(max-width:520px){ #hnf-client-view-calendar.hnf-client-calendar-screen{gap:12px!important} .hnf-calendar-premium-hero{grid-template-columns:1fr 64px!important;gap:10px!important;padding:16px 14px!important} .hnf-calendar-hero-copy h3{font-size:21px!important}.hnf-calendar-hero-copy p{font-size:10px!important;line-height:1.45!important} .hnf-calendar-hero-mark{width:58px;height:58px}.hnf-calendar-hero-mark strong{font-size:16px}.hnf-calendar-hero-mark span{font-size:5px;margin-top:4px} .hnf-client-calendar-stats>div{padding:10px 8px!important;border-radius:11px!important}.hnf-client-calendar-stats span{font-size:6px!important}.hnf-client-calendar-stats strong{font-size:19px!important}.hnf-client-calendar-stats small{font-size:7px!important} .hnf-client-next-appointment{padding:14px!important}.hnf-next-appointment-copy strong{font-size:14px!important}.hnf-next-appointment-time{font-size:12px!important} .hnf-client-calendar-controls{grid-template-columns:40px minmax(0,1fr) auto 40px!important}.hnf-client-calendar-controls button{min-width:38px!important;padding:8px!important} } /* ========================================================== v6.4.8 Mock-up Match — Client Alerts & Coaching ========================================================== */ .hnf-client-alerts-screen{ display:grid; gap:16px; align-content:start; } .hnf-client-alerts-screen[hidden]{display:none!important} .hnf-alerts-head{margin-bottom:0!important} .hnf-alerts-premium-hero{ position:relative; overflow:hidden; min-height:174px; padding:26px 28px; border:1px solid rgba(139,92,246,.38); border-radius:22px; background: radial-gradient(circle at 84% 32%,rgba(139,92,246,.32),transparent 31%), radial-gradient(circle at 98% 104%,rgba(99,102,241,.20),transparent 38%), linear-gradient(135deg,#0e0d18 0%,#121020 55%,#231345 100%); box-shadow:0 18px 48px rgba(0,0,0,.30); } .hnf-alerts-premium-hero:after{ content:"";position:absolute;right:-52px;bottom:-86px;width:250px;height:250px;border-radius:50%; border:1px solid rgba(167,139,250,.18);box-shadow:0 0 0 34px rgba(139,92,246,.035),0 0 0 68px rgba(139,92,246,.025);pointer-events:none } .hnf-alerts-hero-copy{position:relative;z-index:1;max-width:580px} .hnf-alerts-hero-copy>strong{display:block;margin:8px 0 8px;font-size:30px;line-height:1.02;letter-spacing:-.03em;color:#fff} .hnf-alerts-hero-copy>small{display:block;max-width:500px;color:#a7a7b3;font-size:12px;line-height:1.55} .hnf-alerts-hero-side{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:12px;min-width:112px} .hnf-alerts-hero-mark{display:grid;place-items:center;width:88px;height:88px;border-radius:50%;border:1px solid rgba(167,139,250,.55);background:radial-gradient(circle,rgba(139,92,246,.22),rgba(10,10,18,.5));box-shadow:inset 0 0 32px rgba(139,92,246,.13)} .hnf-alerts-hero-mark strong{font-size:23px;line-height:1;color:#fff} .hnf-alerts-hero-mark span{font-size:7px;letter-spacing:.18em;color:#c4b5fd;margin-top:-17px} .hnf-alerts-hero-side>b{padding:7px 10px;border-radius:999px;background:rgba(139,92,246,.15);border:1px solid rgba(139,92,246,.35);color:#d7ccff;font-size:10px} .hnf-alerts-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .hnf-alerts-summary article{padding:15px 16px;border:1px solid #292935;border-radius:15px;background:linear-gradient(180deg,#15151d,#121219)} .hnf-alerts-summary span{display:block;color:#9f7aea;font-size:8px;font-weight:900;letter-spacing:.12em} .hnf-alerts-summary strong{display:block;margin:6px 0 2px;color:#fff;font-size:24px;line-height:1} .hnf-alerts-summary small{color:#777783;font-size:9px} .hnf-alerts-inbox-card{padding:18px;border:1px solid #292935;border-radius:18px;background:#101017} .hnf-alerts-inbox-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:4px} .hnf-alerts-inbox-head h3{margin:4px 0 0;font-size:18px;color:#f7f7fb} .hnf-alerts-inbox-head>button{min-height:38px!important;padding:8px 12px!important;border-radius:10px!important;font-size:9px!important} .hnf-mobile-alerts-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .hnf-mobile-alert-item{min-height:116px;align-items:center;padding:15px;border-radius:15px;background:linear-gradient(160deg,#15151d,#111118)} .hnf-mobile-alert-item.is-unread{box-shadow:inset 3px 0 0 #8b5cf6;background:linear-gradient(100deg,rgba(139,92,246,.11),#15151d 36%)} .hnf-mobile-alert-copy p{font-size:10px;line-height:1.5} .hnf-mobile-alert-copy small{font-size:8.5px} .hnf-mobile-alert-empty{grid-column:1/-1;min-height:160px;background:#121219} @media (max-width:900px){ .hnf-client-alerts-screen{gap:12px} .hnf-alerts-premium-hero{min-height:0;padding:18px;border-radius:18px;align-items:center} .hnf-alerts-hero-copy>strong{font-size:25px} .hnf-alerts-hero-copy>small{font-size:10px;max-width:250px} .hnf-alerts-hero-side{min-width:82px} .hnf-alerts-hero-mark{width:70px;height:70px} .hnf-alerts-hero-mark strong{font-size:19px} .hnf-alerts-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .hnf-alerts-summary article{padding:12px 13px} .hnf-alerts-summary strong{font-size:21px} .hnf-alerts-inbox-card{padding:13px;border-radius:16px} .hnf-alerts-inbox-head h3{font-size:16px} .hnf-mobile-alerts-toolbar{padding-top:10px} .hnf-mobile-alerts-list{grid-template-columns:1fr} .hnf-mobile-alert-item{min-height:0;padding:13px} } @media (max-width:520px){ html.hnf-client-mobile-device #hnf-client-view-alerts{padding-bottom:28px!important} .hnf-alerts-premium-hero{padding:16px 14px;gap:10px} .hnf-alerts-hero-copy>strong{font-size:22px} .hnf-alerts-hero-copy>small{font-size:9.5px;line-height:1.45} .hnf-alerts-hero-mark{width:62px;height:62px} .hnf-alerts-hero-mark strong{font-size:17px} .hnf-alerts-hero-mark span{font-size:6px;margin-top:-13px} .hnf-alerts-hero-side>b{font-size:8px;padding:6px 8px} .hnf-alerts-summary article{padding:11px} .hnf-alerts-summary strong{font-size:19px} .hnf-alerts-inbox-head{align-items:flex-end} .hnf-alerts-inbox-head>button{padding:7px 9px!important;font-size:8px!important} } /* ========================================================== v6.4.9 Client UI Final Polish Unified rhythm, responsive density, progress readability, and unobtrusive PWA prompt placement. ========================================================== */ :root{--hnf-client-gap:14px;--hnf-client-radius:16px} .hnf-client-view,.hnf-client-home-shell{min-width:0} .hnf-client-view h2,.hnf-client-view h3,.hnf-client-view h4{letter-spacing:-.018em} .hnf-client-view button,.hnf-client-home-shell button{transition:transform .16s ease,filter .16s ease,border-color .16s ease,background .16s ease} @media(hover:hover) and (pointer:fine){.hnf-client-view button:hover,.hnf-client-home-shell button:hover{filter:brightness(1.08)}} @media(min-width:980px){ #hnf-client-dashboard{max-width:1180px;margin-inline:auto} .hnf-client-view{gap:14px} .hnf-client-view>.hnf-client-card,.hnf-client-view>.hnf-progress-card{margin-top:0} .hnf-client-desktop-rail{bottom:auto!important;min-height:690px;height:calc(100vh - 110px);max-height:820px;position:absolute!important} .hnf-client-rail-foot{margin-top:auto} .hnf-client-nav{position:sticky;top:12px;z-index:12;backdrop-filter:blur(14px)} } @media(max-width:979px){ #hnf-client-dashboard{max-width:760px;margin-inline:auto} .hnf-client-view{min-width:0} } @media(max-width:760px){ #hnf-client-dashboard{padding-left:12px!important;padding-right:12px!important;padding-bottom:112px!important} .hnf-client-view,.hnf-client-home-shell{gap:10px!important} .hnf-client-view>h2,.hnf-client-view .hnf-mobile-section-title{margin-top:0!important} .hnf-client-view button{min-height:42px} .hnf-client-view input,.hnf-client-view select,.hnf-client-view textarea{font-size:16px!important} .hnf-client-bottom-nav{left:8px!important;right:8px!important;bottom:8px!important;width:auto!important;border-radius:18px!important;padding:7px!important;gap:3px!important;box-shadow:0 16px 45px rgba(0,0,0,.55)!important} .hnf-client-bottom-btn{min-width:0!important;min-height:54px!important;padding:7px 3px!important;border-radius:12px!important} .hnf-client-bottom-btn span{font-size:.62rem!important} .hnf-client-bottom-btn small{font-size:.55rem!important} .hnf-client-bottom-btn.active{box-shadow:0 8px 24px rgba(91,33,182,.28)!important} /* Keep long progress content dense without hiding any data. */ #hnf-client-view-progress{gap:10px!important} #hnf-client-view-progress .hnf-progress-card{margin:0!important;padding:13px!important;border-radius:14px!important} #hnf-client-view-progress .hnf-progress-columns{gap:10px!important} #hnf-client-view-progress .hnf-progress-summary{gap:7px!important;margin-bottom:10px!important} #hnf-client-view-progress .hnf-progress-summary>div{padding:10px!important} #hnf-client-view-progress .hnf-progress-insights-shell{gap:10px!important} #hnf-client-view-progress .hnf-progress-insights-summary{gap:7px!important} #hnf-client-view-progress .hnf-progress-insights-summary>div{padding:10px!important} #hnf-client-view-progress .hnf-progress-metric-tabs{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important} #hnf-client-view-progress .hnf-progress-metric-tabs button{min-height:34px!important;padding:6px 4px!important;font-size:.62rem!important} #hnf-client-view-progress .hnf-progress-range-tabs button{min-height:34px!important;padding:6px!important;font-size:.62rem!important} #hnf-client-view-progress .hnf-progress-gallery{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important} #hnf-client-view-progress .hnf-progress-gallery img{border-radius:10px!important} #hnf-progress-insight-chart{min-height:180px!important} /* Reduce dead space after short Calendar/Alerts states. */ #hnf-client-view-calendar,#hnf-client-view-alerts{min-height:0!important;padding-bottom:18px!important} .hnf-client-calendar-screen,.hnf-client-alerts-screen{min-height:0!important} .hnf-mobile-alert-empty{min-height:120px!important} /* Install/update prompt: compact, below browser chrome and clear of content. */ .hnf-pwa-install,.hnf-pwa-install-banner,[data-hnf-install-prompt],.hnf-app-update-toast,.hnf-update-toast,[data-hnf-update-prompt]{ top:calc(10px + env(safe-area-inset-top))!important;max-width:min(330px,calc(100vw - 72px))!important;border-radius:14px!important;box-shadow:0 14px 38px rgba(0,0,0,.48)!important } } @media(max-width:430px){ #hnf-client-dashboard{padding-left:10px!important;padding-right:10px!important} .hnf-client-bottom-nav{grid-template-columns:repeat(6,minmax(0,1fr))!important} .hnf-client-bottom-btn{min-height:52px!important} #hnf-client-view-progress .hnf-progress-metric-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important} .hnf-alerts-premium-hero,.hnf-calendar-premium-hero,.hnf-nutrition-premium-hero{border-radius:16px!important} } /* ========================================================== v6.5.0 Trainer UI Redesign — Phase 1 / Coach Home Premium coach shell while preserving existing trainer logic. ========================================================== */ .hnf-trainer-app{--hnf-coach-purple:#8b5cf6;--hnf-coach-panel:#0d0d16;--hnf-coach-card:#11111b} .hnf-trainer-card{border-radius:24px!important;border:1px solid rgba(139,92,246,.20)!important;background:linear-gradient(180deg,rgba(18,14,32,.92),rgba(7,8,13,.98))!important;box-shadow:0 28px 80px rgba(0,0,0,.38)!important;overflow:hidden} .hnf-trainer-head{padding:20px 22px 16px!important;border-bottom:1px solid rgba(255,255,255,.06)!important;background:linear-gradient(110deg,rgba(7,8,14,.98),rgba(34,18,68,.78))!important} .hnf-trainer-head h2{font-size:clamp(24px,3vw,34px)!important;letter-spacing:-.035em!important;margin-bottom:5px!important} .hnf-trainer-head .hnf-muted{max-width:560px} .hnf-push-actions{gap:7px!important} .hnf-push-actions button,.hnf-push-actions .hnf-push-status{border-radius:9px!important;font-size:11px!important;min-height:34px!important;padding:8px 11px!important} .hnf-trainer-premium-hero{margin:18px 20px 16px;padding:24px;display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:24px;align-items:center;border:1px solid rgba(139,92,246,.38);border-radius:20px;background:radial-gradient(circle at 88% 50%,rgba(139,92,246,.27),transparent 30%),linear-gradient(120deg,#0d0c18 0%,#121020 58%,#21123f 100%);overflow:hidden;position:relative} .hnf-trainer-premium-kicker{display:block;color:#a78bfa;font-size:10px;font-weight:900;letter-spacing:.17em;margin-bottom:9px} .hnf-trainer-premium-copy h3{font-size:clamp(25px,3vw,38px);line-height:.98;letter-spacing:-.045em;margin:0 0 12px;color:#fff} .hnf-trainer-premium-copy p{max-width:620px;margin:0;color:rgba(255,255,255,.66);font-size:13px;line-height:1.55} .hnf-trainer-premium-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px} .hnf-trainer-premium-actions button{border-radius:10px!important;min-height:38px!important;padding:9px 15px!important} .hnf-trainer-premium-mark{width:118px;height:118px;justify-self:center;border-radius:50%;display:grid;place-items:center;align-content:center;border:1px solid rgba(167,139,250,.55);background:radial-gradient(circle,rgba(139,92,246,.25),rgba(18,16,32,.86) 62%);box-shadow:0 0 0 18px rgba(139,92,246,.035),0 0 0 38px rgba(139,92,246,.025)} .hnf-trainer-premium-mark strong{font-size:30px;letter-spacing:-.06em}.hnf-trainer-premium-mark span{font-size:7px;font-weight:900;letter-spacing:.2em;color:#c4b5fd;margin-top:-17px} .hnf-trainer-desktop-nav-wrap{padding:0 20px!important} .hnf-trainer-desktop-nav{padding:5px!important;border-radius:13px!important;background:rgba(255,255,255,.025)!important;border:1px solid rgba(255,255,255,.07)!important;gap:5px!important} .hnf-trainer-desktop-nav-btn{border-radius:9px!important;min-height:38px!important;font-weight:750!important} .hnf-trainer-desktop-nav-btn.active{background:linear-gradient(135deg,#7c3aed,#9b5cff)!important;box-shadow:0 8px 24px rgba(124,58,237,.25)!important} .hnf-trainer-grid{padding:0 20px!important;gap:10px!important;margin:14px 0 18px!important} .hnf-trainer-stat{min-height:94px!important;border-radius:15px!important;border:1px solid rgba(255,255,255,.075)!important;background:linear-gradient(145deg,rgba(19,20,31,.98),rgba(10,11,18,.98))!important;padding:16px!important;text-align:left!important} .hnf-trainer-stat strong{font-size:28px!important;line-height:1!important}.hnf-trainer-stat span{font-size:12px!important;opacity:.65!important;margin-top:7px!important} .hnf-trainer-stat.active{border-color:rgba(139,92,246,.55)!important;box-shadow:inset 0 0 0 1px rgba(139,92,246,.12)!important} #hnf-panel-overview{padding:0 20px 24px!important} .hnf-daily-dashboard{margin-bottom:20px!important} .hnf-daily-dashboard>.hnf-panel-head{padding:18px 0 6px!important} .hnf-daily-dashboard>.hnf-panel-head h3{font-size:22px!important;letter-spacing:-.025em!important} .hnf-daily-stats>div,.hnf-daily-card,.hnf-adherence-panel,.hnf-nutrition-home-panel,.hnf-adherence-trends-panel,.hnf-alerts-panel,.hnf-today-tasks{background:linear-gradient(145deg,rgba(18,19,29,.98),rgba(10,11,18,.98))!important;border-color:rgba(255,255,255,.075)!important;border-radius:16px!important} .hnf-daily-card h4,.hnf-workspace-section-head h4{font-size:14px!important;letter-spacing:-.01em!important} .hnf-clients-head{margin-top:18px!important;padding-top:18px!important;border-top:1px solid rgba(255,255,255,.07)!important} @media(max-width:1100px){ .hnf-trainer-premium-hero{grid-template-columns:minmax(0,1fr) 120px}.hnf-trainer-premium-mark{width:96px;height:96px} } @media(max-width:900px){ .hnf-trainer-card{border-radius:18px!important} .hnf-trainer-head{padding:16px 14px 12px!important} .hnf-trainer-premium-hero{margin:12px 12px 14px;padding:18px;grid-template-columns:1fr 82px;gap:12px;border-radius:17px} .hnf-trainer-premium-copy h3{font-size:25px}.hnf-trainer-premium-copy p{font-size:11px}.hnf-trainer-premium-mark{width:72px;height:72px}.hnf-trainer-premium-mark strong{font-size:21px}.hnf-trainer-premium-mark span{font-size:5px;margin-top:-12px} .hnf-trainer-premium-actions button{min-height:36px!important;font-size:10px!important} #hnf-panel-overview{padding:0 12px 100px!important} } @media(max-width:520px){ .hnf-trainer-premium-hero{grid-template-columns:1fr;padding:16px}.hnf-trainer-premium-mark{position:absolute;right:14px;top:14px;width:58px;height:58px;opacity:.72} .hnf-trainer-premium-copy{padding-right:52px}.hnf-trainer-premium-copy h3{font-size:23px}.hnf-trainer-premium-copy p{font-size:10px} .hnf-trainer-premium-actions{margin-top:12px}.hnf-trainer-premium-actions button{padding:8px 10px!important} } /* ========================================================== v6.5.1 Trainer UI Redesign — Phase 2 / Mobile Coach Home Turns the trainer overview into a compact mobile command center while preserving the proven .hnf-trainer-grid bottom-nav strategy. ========================================================== */ @media(max-width:900px){ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-card{ overflow:visible!important; border-radius:16px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head{ padding:12px 12px 10px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head h2{ font-size:20px!important; line-height:1.05!important; margin:0 0 3px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head .hnf-muted{ font-size:10px!important; line-height:1.35!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions{ display:flex!important; flex-wrap:nowrap!important; gap:6px!important; margin-top:9px!important; overflow-x:auto!important; padding-bottom:3px!important; scrollbar-width:none!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions::-webkit-scrollbar{display:none!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions>*{ flex:0 0 auto!important; min-height:31px!important; padding:7px 9px!important; font-size:9px!important; white-space:nowrap!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-hero{ min-height:0!important; margin:9px 10px 10px!important; padding:14px!important; border-radius:15px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-kicker{font-size:7px!important;margin-bottom:5px!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-copy h3{font-size:21px!important;line-height:1!important;margin-bottom:7px!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-copy p{font-size:9px!important;line-height:1.35!important;max-width:270px!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-actions{margin-top:9px!important;gap:6px!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-actions button{min-height:32px!important;padding:7px 10px!important;font-size:9px!important} /* Daily dashboard becomes a compact coach command center. */ html.hnf-trainer-phone #hnf-panel-overview{padding:0 10px 88px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-dashboard{margin-bottom:12px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-dashboard>.hnf-panel-head{padding:10px 0 4px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-dashboard>.hnf-panel-head h3{font-size:18px!important;margin:0!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-dashboard>.hnf-panel-head p{display:none!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-dashboard-date{font-size:9px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-stats{ grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:6px!important; margin:7px 0 10px!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-stats>div{padding:9px 7px!important;border-radius:11px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-stats span{font-size:7px!important;line-height:1.15!important;margin-bottom:3px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-stats strong{font-size:18px!important} /* Needs attention / recent activity: one swipeable row instead of three tall stacks. */ html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-grid{ display:flex!important; gap:8px!important; overflow-x:auto!important; scroll-snap-type:x proximity!important; padding:0 0 5px!important; scrollbar-width:none!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-grid::-webkit-scrollbar{display:none!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-card{ flex:0 0 min(82vw,300px)!important; min-width:0!important; max-height:238px!important; overflow:auto!important; scroll-snap-align:start!important; padding:11px!important; border-radius:13px!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-card-head{margin-bottom:3px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-card-head h4{font-size:12px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-item{padding:8px 0!important;gap:7px!important;flex-direction:row!important;align-items:center!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-item strong{font-size:11px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-item span{font-size:8px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-actions{gap:4px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-actions button{min-height:28px!important;padding:5px 7px!important;font-size:8px!important} /* Adherence sections stay fully available, but as horizontal summary rails. */ html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-panel, html.hnf-trainer-phone #hnf-panel-overview .hnf-nutrition-home-panel, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trends-panel, html.hnf-trainer-phone #hnf-panel-overview .hnf-alerts-panel, html.hnf-trainer-phone #hnf-panel-overview .hnf-today-tasks{ margin-top:9px!important; padding:11px!important; border-radius:13px!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-workspace-section-head{gap:7px!important;margin-bottom:5px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-workspace-section-head h4{font-size:12px!important;margin:0!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-workspace-section-head p{display:none!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-workspace-section-head button{min-height:30px!important;padding:6px 8px!important;font-size:8px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-grid, html.hnf-trainer-phone #hnf-panel-overview .hnf-nutrition-adherence-grid, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trends{ display:flex!important; gap:7px!important; overflow-x:auto!important; padding:2px 0 5px!important; scrollbar-width:none!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-grid::-webkit-scrollbar, html.hnf-trainer-phone #hnf-panel-overview .hnf-nutrition-adherence-grid::-webkit-scrollbar, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trends::-webkit-scrollbar{display:none!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-card, html.hnf-trainer-phone #hnf-panel-overview .hnf-nutrition-adherence-card, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trend-card{ flex:0 0 min(76vw,270px)!important; padding:10px!important; border-radius:11px!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-top b, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trend-head b{font-size:17px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-trend-chart{height:72px!important;margin:8px 0!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-trend-bar-wrap{height:50px!important} /* Long signals/tasks remain usable inside bounded scroll cards. */ html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-list{max-height:260px!important;overflow:auto!important;margin-top:3px!important;padding-right:2px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-task-list{max-height:320px!important;overflow:auto!important;margin-top:3px!important;padding-right:2px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-row, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-row{padding:8px 0!important;gap:7px!important;flex-direction:row!important;align-items:center!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-main, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-main{gap:7px!important;align-items:center!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-main strong, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-main strong{font-size:10.5px!important;line-height:1.25!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-main>div>span, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-main>div>span{font-size:7.5px!important;line-height:1.2!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-badge, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-badge{font-size:7px!important;padding:4px 5px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-task-row button, html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-row button{min-height:28px!important;padding:5px 7px!important;font-size:7.5px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-task-history{margin-top:7px!important;padding-top:7px!important} /* Clients stay reachable on Home without turning the page into a giant feed. */ html.hnf-trainer-phone #hnf-panel-overview .hnf-clients-head{margin-top:10px!important;padding-top:10px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-clients-head h3{font-size:15px!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-clients-head button{min-height:32px!important;padding:7px 9px!important;font-size:8px!important} html.hnf-trainer-phone #hnf-panel-overview #hnf-clients-list{ max-height:610px!important; overflow:auto!important; padding-right:2px!important; scrollbar-width:thin!important; } html.hnf-trainer-phone #hnf-panel-overview #hnf-clients-list .hnf-list-item, html.hnf-trainer-phone #hnf-panel-overview #hnf-clients-list .hnf-client-card{margin-bottom:7px!important} } @media(max-width:520px){ html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-card{flex-basis:min(86vw,286px)!important} html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-card, html.hnf-trainer-phone #hnf-panel-overview .hnf-nutrition-adherence-card, html.hnf-trainer-phone #hnf-panel-overview .hnf-adherence-trend-card{flex-basis:min(82vw,260px)!important} } /* ========================================================== v6.5.2 Trainer Desktop Width / Overflow Fix Prevents coach header, navigation and dashboard cards from forcing the trainer shell beyond the desktop viewport. ========================================================== */ @media (min-width:901px){ #hnf-trainer-dashboard, #hnf-trainer-dashboard *{box-sizing:border-box} #hnf-trainer-dashboard{ width:min(1180px,calc(100vw - 48px))!important; max-width:1180px!important; min-width:0!important; overflow-x:hidden!important; } #hnf-trainer-dashboard .hnf-trainer-card{ width:100%!important; max-width:100%!important; min-width:0!important; overflow:hidden!important; } /* Header copy and notification controls must share available width. */ #hnf-trainer-dashboard .hnf-trainer-head{ display:grid!important; grid-template-columns:minmax(250px,.9fr) minmax(0,1.55fr)!important; gap:18px!important; width:100%!important; max-width:100%!important; min-width:0!important; } #hnf-trainer-dashboard .hnf-trainer-head>div, #hnf-trainer-dashboard .hnf-push-actions{ min-width:0!important; max-width:100%!important; } #hnf-trainer-dashboard .hnf-push-actions{ width:100%!important; flex-wrap:wrap!important; justify-content:flex-end!important; overflow:visible!important; } #hnf-trainer-dashboard .hnf-push-actions>*{ max-width:100%!important; white-space:normal!important; } /* Keep every desktop navigation tab inside the card. */ #hnf-trainer-dashboard .hnf-trainer-desktop-nav-wrap, #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ width:100%!important; max-width:100%!important; min-width:0!important; overflow:hidden!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ display:grid!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; gap:5px!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav-btn{ width:100%!important; min-width:0!important; padding-left:8px!important; padding-right:8px!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } /* All overview grids/cards are allowed to shrink instead of overflowing. */ #hnf-panel-overview, #hnf-panel-overview .hnf-daily-dashboard, #hnf-panel-overview .hnf-daily-stats, #hnf-panel-overview .hnf-daily-grid, #hnf-panel-overview .hnf-adherence-grid, #hnf-panel-overview .hnf-nutrition-adherence-grid, #hnf-panel-overview .hnf-adherence-trends, #hnf-panel-overview #hnf-clients-list{ width:100%!important; max-width:100%!important; min-width:0!important; } #hnf-panel-overview .hnf-daily-stats>*, #hnf-panel-overview .hnf-daily-grid>*, #hnf-panel-overview .hnf-adherence-grid>*, #hnf-panel-overview .hnf-nutrition-adherence-grid>*, #hnf-panel-overview .hnf-adherence-trends>*, #hnf-panel-overview #hnf-clients-list>*{ min-width:0!important; max-width:100%!important; } } /* Medium desktop / narrow laptop: reduce pressure before switching to phone UI. */ @media (min-width:901px) and (max-width:1180px){ #hnf-trainer-dashboard{width:calc(100vw - 28px)!important} #hnf-trainer-dashboard .hnf-trainer-head{ grid-template-columns:minmax(220px,.82fr) minmax(0,1.35fr)!important; } #hnf-trainer-dashboard .hnf-push-actions button, #hnf-trainer-dashboard .hnf-push-actions .hnf-push-status{ font-size:9px!important; padding:7px 8px!important; } #hnf-trainer-dashboard .hnf-trainer-desktop-nav-btn{font-size:10px!important} } /* ========================================================== v6.5.3 Trainer Desktop Overflow Fix The previous desktop guard only activated at a viewport media query. This pass follows the trainer's actual desktop state and makes every coach grid/button row shrink or reflow inside the dashboard instead of being clipped at the right edge. ========================================================== */ html.hnf-trainer-desktop #hnf-trainer-dashboard, html.hnf-trainer-desktop #hnf-trainer-dashboard *{box-sizing:border-box} html.hnf-trainer-desktop #hnf-trainer-dashboard{ width:100%!important; max-width:1180px!important; min-width:0!important; overflow-x:visible!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-card{ width:100%!important; max-width:100%!important; min-width:0!important; overflow-x:visible!important; container-type:inline-size; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-head, html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-premium-hero, html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav-wrap, html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-grid, html.hnf-trainer-desktop #hnf-panel-overview, html.hnf-trainer-desktop #hnf-panel-overview > *, html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-dashboard, html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-stats, html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-nutrition-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-trends, html.hnf-trainer-desktop #hnf-panel-overview .hnf-alert-list, html.hnf-trainer-desktop #hnf-panel-overview .hnf-task-list, html.hnf-trainer-desktop #hnf-panel-overview #hnf-clients-list{ width:100%!important; max-width:100%!important; min-width:0!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-head{ display:grid!important; grid-template-columns:minmax(220px,.8fr) minmax(0,1.6fr)!important; align-items:start!important; gap:16px!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-head>*, html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-push-actions{min-width:0!important;max-width:100%!important} html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-push-actions{ display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:6px!important; width:100%!important; justify-content:stretch!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-push-actions>*{ width:100%!important; min-width:0!important; max-width:100%!important; white-space:normal!important; overflow-wrap:anywhere!important; text-align:center!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav-wrap{padding-left:20px!important;padding-right:20px!important;overflow:visible!important} html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav{ display:grid!important; grid-template-columns:repeat(6,minmax(0,1fr))!important; width:100%!important; max-width:100%!important; min-width:0!important; overflow:visible!important; } html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav-btn{ width:100%!important; min-width:0!important; max-width:100%!important; white-space:normal!important; line-height:1.15!important; padding:8px 6px!important; overflow:visible!important; text-overflow:clip!important; } /* Never let a grid child impose its intrinsic width on the coach shell. */ html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-stats>*, html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-grid>*, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-grid>*, html.hnf-trainer-desktop #hnf-panel-overview .hnf-nutrition-adherence-grid>*, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-trends>*, html.hnf-trainer-desktop #hnf-panel-overview #hnf-clients-list>*{ min-width:0!important; max-width:100%!important; } html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-item, html.hnf-trainer-desktop #hnf-panel-overview .hnf-alert-row, html.hnf-trainer-desktop #hnf-panel-overview .hnf-task-row, html.hnf-trainer-desktop #hnf-panel-overview .hnf-client-card, html.hnf-trainer-desktop #hnf-panel-overview .hnf-list-item{min-width:0!important;max-width:100%!important} html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-actions, html.hnf-trainer-desktop #hnf-panel-overview .hnf-alert-actions, html.hnf-trainer-desktop #hnf-panel-overview .hnf-task-actions{ flex-wrap:wrap!important; min-width:0!important; } html.hnf-trainer-desktop #hnf-panel-overview button, html.hnf-trainer-desktop #hnf-panel-overview .button, html.hnf-trainer-desktop #hnf-panel-overview a.button{ max-width:100%!important; } /* Container-aware reflow: works even when WordPress/theme makes the app narrower than the browser viewport. */ @container (max-width: 920px){ html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-head{grid-template-columns:1fr!important} html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-push-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-nutrition-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-trends, html.hnf-trainer-desktop #hnf-panel-overview #hnf-clients-list{grid-template-columns:repeat(2,minmax(0,1fr))!important} } @container (max-width: 700px){ html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-push-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-trainer-dashboard .hnf-trainer-desktop-nav{grid-template-columns:repeat(2,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} html.hnf-trainer-desktop #hnf-panel-overview .hnf-daily-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-nutrition-adherence-grid, html.hnf-trainer-desktop #hnf-panel-overview .hnf-adherence-trends, html.hnf-trainer-desktop #hnf-panel-overview #hnf-clients-list{grid-template-columns:1fr!important} } /* ========================================================== v6.5.5 Trainer Mobile Safe Reset Restores the stable v6.5.3 mobile geometry after the v6.5.4 full-viewport breakout caused the trainer UI to collapse. Only conservative phone refinements are applied here. ========================================================== */ @media (max-width:900px){ html.hnf-trainer-phone #hnf-trainer-dashboard, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-card, html.hnf-trainer-phone #hnf-panel-overview{ min-width:0!important; max-width:100%!important; box-sizing:border-box!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:6px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions>*{ min-width:0!important; width:100%!important; white-space:normal!important; } html.hnf-trainer-phone #hnf-panel-overview .hnf-alert-actions, html.hnf-trainer-phone #hnf-panel-overview .hnf-task-actions, html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-actions{ display:flex!important; flex-wrap:wrap!important; gap:5px!important; } } /* ========================================================== v6.5.6 Dedicated Trainer Mobile Home Separate compact coach presentation; desktop dashboard stays intact. ========================================================== */ .hnf-trainer-mobile-home{display:none} @media (max-width:900px){ html.hnf-trainer-phone #hnf-panel-overview .hnf-daily-dashboard, html.hnf-trainer-phone #hnf-panel-overview > .hnf-clients-head, html.hnf-trainer-phone #hnf-panel-overview > #hnf-clients-list{display:none!important} html.hnf-trainer-phone #hnf-trainer-mobile-home{display:block!important;padding:10px 0 88px!important} html.hnf-trainer-phone #hnf-trainer-mobile-home[hidden]{display:block!important} .hnf-mobile-coach-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:0 0 12px;padding:2px 2px 0} .hnf-mobile-coach-heading span{font-size:9px;font-weight:800;letter-spacing:.12em;color:#a78bfa} .hnf-mobile-coach-heading h3{margin:4px 0 2px!important;font-size:20px!important;line-height:1.05!important} .hnf-mobile-coach-heading p{margin:0!important;font-size:11px!important;opacity:.65} #hnf-mobile-coach-date{white-space:nowrap!important;color:inherit!important;opacity:.6!important;letter-spacing:0!important;font-weight:600!important} .hnf-mobile-coach-stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-bottom:10px!important} .hnf-mobile-coach-stats>div{border:1px solid rgba(255,255,255,.09)!important;border-radius:12px!important;padding:11px!important;background:rgba(255,255,255,.025)!important;min-width:0!important} .hnf-mobile-coach-stats span{display:block!important;font-size:10px!important;opacity:.62!important;margin-bottom:4px!important} .hnf-mobile-coach-stats strong{font-size:22px!important;line-height:1!important} .hnf-mobile-coach-section{margin-top:10px!important;padding:12px!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:14px!important;background:rgba(255,255,255,.018)!important;overflow:hidden!important} .hnf-mobile-coach-section-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-bottom:8px!important} .hnf-mobile-coach-section-head h4{margin:0!important;font-size:14px!important} .hnf-mobile-coach-section-head>span{font-size:10px!important;opacity:.58!important} .hnf-mobile-coach-list{display:grid!important;grid-template-columns:1fr!important;gap:7px!important;min-width:0!important} .hnf-mobile-coach-list>.hnf-daily-item, .hnf-mobile-coach-list>.hnf-alert-row, .hnf-mobile-coach-list>.hnf-task-row, .hnf-mobile-coach-list>.hnf-adherence-card{margin:0!important;padding:10px!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:11px!important;background:rgba(255,255,255,.025)!important;min-width:0!important;display:block!important} .hnf-mobile-coach-list .hnf-daily-actions{margin-top:8px!important;display:flex!important;flex-wrap:wrap!important;gap:5px!important} .hnf-mobile-coach-list .hnf-daily-actions>*{flex:0 0 auto!important;min-height:30px!important;padding:6px 9px!important;font-size:10px!important} .hnf-mobile-coach-list .hnf-alert-main, .hnf-mobile-coach-list .hnf-task-main{display:flex!important;align-items:flex-start!important;gap:8px!important;min-width:0!important} .hnf-mobile-coach-list .hnf-alert-main strong, .hnf-mobile-coach-list .hnf-task-main strong{font-size:12px!important;line-height:1.25!important} .hnf-mobile-coach-list .hnf-alert-main span, .hnf-mobile-coach-list .hnf-task-main span{font-size:10px!important;line-height:1.3!important} .hnf-mobile-activity-tabs{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;margin-bottom:8px!important} .hnf-mobile-activity-tabs button{padding:8px!important;border-radius:9px!important;background:rgba(255,255,255,.035)!important;border:1px solid rgba(255,255,255,.08)!important;font-size:10px!important} .hnf-mobile-activity-tabs button.active{background:linear-gradient(135deg,#7c3aed,#8b5cf6)!important;color:#fff!important;border-color:#8b5cf6!important} .hnf-mobile-client-card{border:1px solid rgba(255,255,255,.08)!important;border-radius:12px!important;padding:11px!important;background:rgba(255,255,255,.025)!important;min-width:0!important} .hnf-mobile-client-top{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:8px!important} .hnf-mobile-client-top strong,.hnf-mobile-client-top span{display:block!important} .hnf-mobile-client-top strong{font-size:14px!important}.hnf-mobile-client-top span{font-size:10px!important;opacity:.65!important;margin-top:2px!important}.hnf-mobile-client-top b{font-size:18px!important} .hnf-mobile-client-meta{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;margin:9px 0!important} .hnf-mobile-client-meta>span{font-size:9px!important;opacity:.58!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:8px!important;padding:7px!important;min-width:0!important} .hnf-mobile-client-meta strong{display:block!important;font-size:10px!important;color:#fff!important;opacity:1!important;margin-top:3px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-hero{margin-bottom:8px!important} html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-grid{z-index:999!important} } /* ========================================================== v6.5.7 Trainer Mobile Polish Refines the dedicated v6.5.6 coach home without changing its data flow or the proven trainer desktop / bottom-nav geometry. ========================================================== */ @media (max-width:900px){ /* Use more of the phone canvas while keeping a safe edge gutter. */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]){ padding-left:8px!important; padding-right:8px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-card{ border-radius:16px!important; } /* Compact app-style coach masthead. */ html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head{ margin:0!important; padding:13px 12px 11px!important; gap:9px!important; border-bottom:1px solid rgba(255,255,255,.065)!important; background:linear-gradient(135deg,rgba(18,14,35,.96),rgba(9,10,17,.98))!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head h2{ font-size:19px!important; letter-spacing:-.025em!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head .hnf-muted{ font-size:9px!important; line-height:1.35!important; max-width:270px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:5px!important; margin-top:2px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-push-actions>*{ min-height:33px!important; padding:6px 7px!important; font-size:8.5px!important; line-height:1.15!important; border-radius:8px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard #hnf-trainer-settings{ grid-column:1 / -1!important; } /* Premium coach card: slightly shorter, less empty space. */ html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-hero{ margin:8px 8px 8px!important; padding:12px!important; border-radius:14px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-copy{ padding-right:48px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-copy h3{ font-size:19px!important; margin-bottom:5px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-copy p{ font-size:8.5px!important; line-height:1.3!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-actions{ margin-top:8px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-actions button{ min-height:30px!important; padding:6px 9px!important; font-size:8.5px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-mark{ width:52px!important; height:52px!important; right:11px!important; top:11px!important; } /* Dedicated mobile dashboard rhythm. */ html.hnf-trainer-phone #hnf-panel-overview{ padding-left:7px!important; padding-right:7px!important; } html.hnf-trainer-phone #hnf-trainer-mobile-home{ padding-top:6px!important; padding-bottom:78px!important; } .hnf-mobile-coach-heading{margin-bottom:9px!important} .hnf-mobile-coach-heading h3{font-size:18px!important} .hnf-mobile-coach-heading p{font-size:9.5px!important} .hnf-mobile-coach-stats{gap:6px!important;margin-bottom:7px!important} .hnf-mobile-coach-stats>div{padding:9px!important;border-radius:10px!important} .hnf-mobile-coach-stats span{font-size:8.5px!important} .hnf-mobile-coach-stats strong{font-size:20px!important} .hnf-mobile-coach-section{ margin-top:7px!important; padding:10px!important; border-radius:12px!important; } .hnf-mobile-coach-section-head{margin-bottom:6px!important} .hnf-mobile-coach-section-head h4{font-size:13px!important} .hnf-mobile-coach-section-head>span{font-size:9px!important} .hnf-mobile-coach-list{gap:5px!important} .hnf-mobile-coach-list>.hnf-daily-item, .hnf-mobile-coach-list>.hnf-alert-row, .hnf-mobile-coach-list>.hnf-task-row, .hnf-mobile-coach-list>.hnf-adherence-card{ padding:8px!important; border-radius:9px!important; } .hnf-mobile-coach-list .hnf-daily-actions{margin-top:6px!important;gap:4px!important} .hnf-mobile-coach-list .hnf-daily-actions>*{ min-height:28px!important; padding:5px 8px!important; font-size:9px!important; } /* Cleaner mobile client summaries. */ .hnf-mobile-client-card{ padding:9px!important; border-radius:10px!important; } .hnf-mobile-client-top strong{font-size:13px!important} .hnf-mobile-client-top span{font-size:9px!important} .hnf-mobile-client-top b{font-size:16px!important} .hnf-mobile-client-meta{gap:5px!important;margin:7px 0!important} .hnf-mobile-client-meta>span{padding:6px!important;font-size:8px!important} .hnf-mobile-client-meta strong{font-size:9px!important} #hnf-mobile-clients .hnf-daily-actions{display:grid!important;grid-template-columns:1fr 1fr!important} #hnf-mobile-clients .hnf-daily-actions>*{width:100%!important;text-align:center!important} /* The dedicated Clients module is the only Clients heading on phone Home. */ html.hnf-trainer-phone #hnf-panel-overview .hnf-clients-head, html.hnf-trainer-phone #hnf-panel-overview > h3.hnf-clients-head, html.hnf-trainer-phone #hnf-panel-overview > div.hnf-clients-head{ display:none!important; } /* Slightly calmer bottom navigation. */ html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid{ padding:5px 6px calc(5px + env(safe-area-inset-bottom))!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card{ min-height:45px!important; padding:4px 3px!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card strong{font-size:13px!important} html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card span, html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]) .hnf-trainer-grid .hnf-nav-card:first-child span::after{font-size:8px!important} } /* ========================================================== v6.5.8 Trainer Mobile Full-Width Shell Fix Expand the OUTER trainer app shell (not the dashboard internals), preserving the stable v6.5.6/6.5.7 mobile card layout. ========================================================== */ @media (max-width:900px){ html.hnf-trainer-phone body{ overflow-x:hidden!important; } /* The WordPress page/theme can constrain the shortcode wrapper. Escape that constraint at the app-shell level only. */ html.hnf-trainer-phone #hnf-trainer-app{ position:relative!important; left:50%!important; transform:translateX(-50%)!important; width:calc(100vw - 16px)!important; max-width:calc(100vw - 16px)!important; margin:18px 0 0!important; padding:0!important; box-sizing:border-box!important; } html.hnf-trainer-phone #hnf-trainer-app > .hnf-trainer-card{ width:100%!important; max-width:none!important; margin:0!important; padding:0!important; box-sizing:border-box!important; overflow:hidden!important; } html.hnf-trainer-phone #hnf-trainer-dashboard:not([hidden]){ width:100%!important; max-width:100%!important; margin:0!important; padding:0 8px calc(82px + env(safe-area-inset-bottom))!important; box-sizing:border-box!important; } html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-head, html.hnf-trainer-phone #hnf-trainer-dashboard .hnf-trainer-premium-hero, html.hnf-trainer-phone #hnf-panel-overview, html.hnf-trainer-phone #hnf-trainer-mobile-home{ width:100%!important; max-width:100%!important; min-width:0!important; box-sizing:border-box!important; } /* Desktop client section is never part of dedicated phone Home. */ html.hnf-trainer-phone #hnf-panel-overview #hnf-clients-section, html.hnf-trainer-phone #hnf-panel-overview #hnf-clients-list{ display:none!important; } } @media (max-width:430px){ html.hnf-trainer-phone #hnf-trainer-app{ width:calc(100vw - 12px)!important; max-width:calc(100vw - 12px)!important; } } /* ========================================================= v6.5.9 Trainer Client Management Redesign ========================================================= */ .hnf-modal-card:has(.hnf-coach-client-hero){ width:min(1160px,96vw)!important; max-height:94vh!important; padding:22px!important; background:linear-gradient(180deg,#0f0c1a 0,#0b0b12 170px,#0b0b10 100%)!important; border:1px solid rgba(139,92,246,.28)!important; box-shadow:0 28px 80px rgba(0,0,0,.6)!important; } .hnf-modal-card:has(.hnf-coach-client-hero) #hnf-modal-title{ font-size:13px!important;letter-spacing:.08em;text-transform:uppercase;color:#b9a7ff!important; margin:0 42px 13px 0!important; } .hnf-coach-client-hero{ display:grid;grid-template-columns:auto minmax(0,1fr) minmax(420px,.9fr) auto; align-items:center;gap:18px;margin:0 0 16px;padding:18px; border:1px solid rgba(139,92,246,.34);border-radius:18px; background:radial-gradient(circle at 92% 15%,rgba(124,58,237,.28),transparent 34%),linear-gradient(135deg,rgba(76,29,149,.19),rgba(11,11,18,.95) 58%); overflow:hidden; } .hnf-coach-client-avatar{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;font-weight:900;font-size:20px;color:#fff;border:1px solid rgba(167,139,250,.6);background:linear-gradient(145deg,#7c3aed,#312e81)} .hnf-coach-client-hero-copy{min-width:0}.hnf-coach-eyebrow{display:block;color:#a78bfa;font-size:9px;font-weight:900;letter-spacing:.16em;margin-bottom:4px}.hnf-coach-client-hero-copy h2{margin:0!important;font-size:25px!important;line-height:1.05}.hnf-coach-client-hero-copy p{margin:5px 0 9px;color:#aaa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .hnf-coach-client-badges{display:flex;flex-wrap:wrap;gap:7px}.hnf-coach-soft-badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);font-size:10px;color:#ddd} .hnf-coach-client-hero-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-width:0}.hnf-coach-client-hero-stats>div{min-width:0;padding:10px;border-radius:11px;background:rgba(4,4,10,.55);border:1px solid rgba(255,255,255,.075)}.hnf-coach-client-hero-stats span{display:block;font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#8d8d9b}.hnf-coach-client-hero-stats strong{display:block;margin-top:5px;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .hnf-coach-client-hero-actions{display:flex}.hnf-coach-hero-wa{white-space:nowrap!important} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;margin:0 0 12px!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary>div{padding:10px!important;background:#111119!important;border-color:rgba(255,255,255,.07)!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary b{font-size:8px!important;text-transform:uppercase;letter-spacing:.08em;color:#8d8d9b!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary span{font-size:11px!important;color:#fff!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-workspace-actions{padding:10px!important;margin-bottom:10px!important;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#0e0e15} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar{position:sticky!important;top:-22px!important;z-index:9!important;margin:0 0 10px!important;padding:9px 10px!important;background:rgba(11,11,16,.94)!important;backdrop-filter:blur(14px);border:1px solid rgba(139,92,246,.16)!important;border-radius:11px!important} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible{border-radius:14px!important;border:1px solid rgba(255,255,255,.075)!important;background:#0e0e15!important;margin-bottom:9px!important;overflow:hidden}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary{padding:13px 15px!important;background:linear-gradient(90deg,rgba(124,58,237,.10),transparent)!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary strong{font-size:13px!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary span{font-size:10px!important;color:#888!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible[open]>summary{border-bottom:1px solid rgba(139,92,246,.18)!important}.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible-body{padding:13px!important} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-head h3,.hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-head h4{font-size:15px!important;margin-bottom:3px!important} .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-modal-actions{position:sticky!important;bottom:-22px!important;z-index:10!important;margin:12px -22px -22px!important;padding:11px 22px!important;background:rgba(8,8,12,.96)!important;border-top:1px solid rgba(255,255,255,.08)!important;backdrop-filter:blur(14px)} /* Trainer client list: easier scanning and action hierarchy. */ html.hnf-trainer-desktop #hnf-clients-list .hnf-client-card-v2{padding:15px!important;border-radius:14px!important;background:linear-gradient(145deg,#111119,#0d0d13)!important;border:1px solid rgba(255,255,255,.075)!important;box-shadow:none!important} html.hnf-trainer-desktop #hnf-clients-list .hnf-client-card-head{gap:12px!important}html.hnf-trainer-desktop #hnf-clients-list .hnf-client-card-identity strong{font-size:15px!important}html.hnf-trainer-desktop #hnf-clients-list .hnf-client-snapshot{gap:7px!important}html.hnf-trainer-desktop #hnf-clients-list .hnf-client-snapshot>div{background:#0a0a10!important;border-radius:9px!important;border:1px solid rgba(255,255,255,.055)!important;padding:9px!important}html.hnf-trainer-desktop #hnf-clients-list .hnf-client-card-actions{padding-top:10px!important;border-top:1px solid rgba(255,255,255,.055)!important}html.hnf-trainer-desktop #hnf-clients-list .hnf-view-client{background:#7c3aed!important;color:#fff!important;border-color:#8b5cf6!important} @media(max-width:900px){ html.hnf-trainer-phone .hnf-modal:has(.hnf-coach-client-hero){padding:0!important;align-items:stretch!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero){width:100%!important;max-width:none!important;height:100%!important;max-height:none!important;border-radius:0!important;padding:12px 11px 84px!important;border:0!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) #hnf-modal-title{font-size:10px!important;margin:2px 40px 9px 1px!important} html.hnf-trainer-phone .hnf-coach-client-hero{grid-template-columns:auto minmax(0,1fr);gap:10px;padding:12px;border-radius:13px;margin-bottom:9px} html.hnf-trainer-phone .hnf-coach-client-avatar{width:44px;height:44px;border-radius:12px;font-size:15px} html.hnf-trainer-phone .hnf-coach-client-hero-copy h2{font-size:19px!important}html.hnf-trainer-phone .hnf-coach-client-hero-copy p{font-size:10px!important;margin:3px 0 7px!important} html.hnf-trainer-phone .hnf-coach-client-hero-stats{grid-column:1/-1;grid-template-columns:1fr 1fr;gap:6px}html.hnf-trainer-phone .hnf-coach-client-hero-stats>div{padding:8px}html.hnf-trainer-phone .hnf-coach-client-hero-stats strong{font-size:11px} html.hnf-trainer-phone .hnf-coach-client-hero-actions{grid-column:1/-1}html.hnf-trainer-phone .hnf-coach-client-hero-actions>*{width:100%;text-align:center} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary>div{padding:8px!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-workspace-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;padding:8px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-workspace-actions>.hnf-inline-assign{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr!important;gap:6px!important;width:100%!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-workspace-actions>span{grid-column:1/-1!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar{top:-12px!important;padding:7px 8px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar>span{font-size:9px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar button{min-height:30px!important;padding:6px 8px!important;font-size:8px!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary{padding:11px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary strong{font-size:12px!important}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary span{font-size:8px!important;max-width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible-body{padding:10px!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-modal-actions{bottom:-84px!important;margin:10px -11px -84px!important;padding:8px 11px 18px!important} } /* ========================================================= v6.5.10 Trainer Client Workspace Mobile Polish Keep the proven workspace structure, but make mobile usage accordion-first so only the coaching task in use is open. ========================================================= */ @media(max-width:900px){ html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero){ padding-top:8px!important; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) #hnf-modal-title{ position:sticky;top:-8px;z-index:14; margin:0 34px 6px 0!important;padding:8px 6px!important; background:rgba(10,9,16,.96);backdrop-filter:blur(14px); border-bottom:1px solid rgba(139,92,246,.14); } html.hnf-trainer-phone .hnf-coach-client-hero{ padding:10px!important;gap:8px!important;margin-bottom:7px!important; } html.hnf-trainer-phone .hnf-coach-client-avatar{width:38px!important;height:38px!important;font-size:13px!important} html.hnf-trainer-phone .hnf-coach-client-hero-copy h2{font-size:17px!important} html.hnf-trainer-phone .hnf-coach-client-badges{gap:4px!important} html.hnf-trainer-phone .hnf-coach-client-hero-stats{gap:4px!important} html.hnf-trainer-phone .hnf-coach-client-hero-stats>div{padding:6px 7px!important} html.hnf-trainer-phone .hnf-coach-client-hero-stats span{font-size:7px!important} html.hnf-trainer-phone .hnf-coach-client-hero-stats strong{font-size:10px!important;margin-top:3px!important} html.hnf-trainer-phone .hnf-coach-client-hero-actions a{min-height:36px!important;padding:8px 10px!important} /* The profile grid repeats information already visible in the coaching hero. Keep it on desktop, remove the duplicate block from the phone workspace. */ html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-profile-summary{display:none!important} html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-client-workspace-actions{ margin-bottom:7px!important;padding:6px!important; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar{ top:30px!important;z-index:13!important;margin-bottom:7px!important; box-shadow:0 8px 22px rgba(0,0,0,.32); } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar>span{ min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-section-toolbar>span b{ color:#fff;font-size:9px; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible{ margin-bottom:7px!important; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary{ min-height:48px;display:flex!important;align-items:center;justify-content:space-between;gap:10px; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary strong{ font-size:13px!important; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible>summary span{ max-width:55%!important;font-size:9px!important;text-align:right; } html.hnf-trainer-phone .hnf-modal-card:has(.hnf-coach-client-hero) .hnf-workspace-collapsible:not([open])>summary{ background:linear-gradient(90deg,rgba(124,58,237,.12),rgba(255,255,255,.015))!important; } } /* ========================================================= v6.5.11 Trainer Exercise Library redesign - Phase 1 ========================================================= */ #hnf-panel-exercises{min-width:0!important;overflow:hidden!important} #hnf-panel-exercises .hnf-exercise-library-hero{ display:flex;align-items:center;justify-content:space-between;gap:24px; padding:24px;margin:0 0 14px;border:1px solid rgba(139,92,246,.38);border-radius:18px; background:radial-gradient(circle at 86% 20%,rgba(139,92,246,.25),transparent 34%),linear-gradient(135deg,#0d0b17,#141026 58%,#28164d); overflow:hidden; } #hnf-panel-exercises .hnf-exercise-library-hero h3{margin:5px 0 6px!important;font-size:28px!important;line-height:1.02!important} #hnf-panel-exercises .hnf-exercise-library-hero p{margin:0!important;max-width:540px;color:#aaa8b7!important;font-size:12px!important;line-height:1.5!important} #hnf-panel-exercises .hnf-kicker{font-size:9px;font-weight:900;letter-spacing:.18em;color:#ad8cff;text-transform:uppercase} #hnf-panel-exercises .hnf-exercise-hero-mark{width:88px;height:88px;flex:0 0 88px;border-radius:50%;border:1px solid rgba(174,139,255,.6);display:grid;place-content:center;text-align:center;background:rgba(20,14,38,.75);box-shadow:0 0 30px rgba(139,92,246,.17) inset} #hnf-panel-exercises .hnf-exercise-hero-mark strong{font-size:24px;line-height:1} #hnf-panel-exercises .hnf-exercise-hero-mark span{font-size:7px;letter-spacing:.16em;color:#bda6ff;margin-top:6px} #hnf-panel-exercises .hnf-exercise-library-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px} #hnf-panel-exercises .hnf-exercise-library-stats>div{background:#111119;border:1px solid #292933;border-radius:14px;padding:14px;min-width:0} #hnf-panel-exercises .hnf-exercise-library-stats strong{display:block;font-size:23px;line-height:1.05;margin-bottom:6px} #hnf-panel-exercises .hnf-exercise-library-stats span{display:block;color:#92909f;font-size:10px} #hnf-panel-exercises .hnf-exercise-library-head{border-top:1px solid rgba(255,255,255,.055);padding-top:14px!important;margin-top:2px!important} #hnf-panel-exercises .hnf-exercise-library-head h4{margin:0!important;font-size:17px!important} #hnf-panel-exercises .hnf-exercise-library-head p{margin:4px 0 0!important;font-size:10px!important} #hnf-panel-exercises .hnf-exercise-tools{display:grid!important;grid-template-columns:minmax(220px,1.5fr) minmax(150px,.75fr) minmax(150px,.75fr)!important;gap:10px!important;margin:0 0 14px!important;padding:12px!important;border:1px solid #292933!important;border-radius:14px!important;background:#101017!important} #hnf-panel-exercises .hnf-exercise-tools label{display:block!important;margin:0!important;color:#928fa0!important;font-size:9px!important;text-transform:uppercase!important;letter-spacing:.08em!important;font-weight:800!important} #hnf-panel-exercises .hnf-exercise-tools input,#hnf-panel-exercises .hnf-exercise-tools select{width:100%!important;min-height:42px!important;margin-top:6px!important;background:#0b0c12!important;border:1px solid #2c2c38!important;border-radius:10px!important;color:#fff!important} #hnf-panel-exercises #hnf-exercises-list{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important} #hnf-panel-exercises .hnf-exercise-card-v3{min-width:0;border:1px solid #292933;border-radius:16px;background:#121219;overflow:hidden;display:flex;flex-direction:column} #hnf-panel-exercises .hnf-exercise-media{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#0d0d14,#1a1230);overflow:hidden} #hnf-panel-exercises .hnf-exercise-media img{width:100%;height:100%;object-fit:cover;display:block} #hnf-panel-exercises .hnf-exercise-media-placeholder{width:100%;height:100%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 50% 40%,rgba(139,92,246,.22),transparent 34%),linear-gradient(145deg,#0d0d14,#171121)} #hnf-panel-exercises .hnf-exercise-media-placeholder strong{font-size:30px;color:#fff;line-height:1} #hnf-panel-exercises .hnf-exercise-media-placeholder span{margin-top:6px;font-size:7px;letter-spacing:.2em;color:#a98cff} #hnf-panel-exercises .hnf-exercise-media-badges{position:absolute;top:9px;left:9px;right:9px;display:flex;gap:6px;flex-wrap:wrap} #hnf-panel-exercises .hnf-exercise-media-badges span{font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:999px;background:rgba(10,10,16,.82);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(8px)} #hnf-panel-exercises .hnf-exercise-media-badges .is-video{margin-left:auto;background:rgba(83,40,146,.88);border-color:rgba(176,132,255,.45)} #hnf-panel-exercises .hnf-exercise-card-body{display:flex;flex-direction:column;flex:1 1 auto;padding:14px;min-width:0} #hnf-panel-exercises .hnf-exercise-card-copy{flex:1 1 auto;min-width:0} #hnf-panel-exercises .hnf-exercise-card-copy strong{font-size:15px!important;margin-bottom:5px!important} #hnf-panel-exercises .hnf-exercise-card-copy>span{font-size:10px!important;color:#9c99aa!important} #hnf-panel-exercises .hnf-exercise-no-instructions{display:block;margin-top:9px;color:#777582;font-size:10px;font-style:italic} #hnf-panel-exercises .hnf-exercise-card-actions{width:100%!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-top:12px!important} #hnf-panel-exercises .hnf-exercise-card-actions>*{width:100%!important;min-width:0!important;text-align:center!important;display:flex!important;align-items:center!important;justify-content:center!important;white-space:normal!important} #hnf-panel-exercises .hnf-exercise-card-actions>*:first-child:nth-last-child(2),#hnf-panel-exercises .hnf-exercise-card-actions>*:first-child:nth-last-child(2)~*{grid-column:auto} #hnf-panel-exercises .hnf-exercise-empty{grid-column:1/-1!important;min-height:180px!important;display:grid!important;place-content:center!important;text-align:center!important;gap:6px!important} #hnf-panel-exercises .hnf-exercise-empty strong{font-size:15px}.hnf-exercise-empty span{font-size:10px;color:#888694} @media (max-width:1180px){#hnf-panel-exercises #hnf-exercises-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media (max-width:900px){ html.hnf-trainer-phone #hnf-panel-exercises{padding:8px!important;overflow:visible!important} #hnf-panel-exercises .hnf-exercise-library-hero{padding:16px!important;gap:12px!important;border-radius:15px!important} #hnf-panel-exercises .hnf-exercise-library-hero h3{font-size:22px!important} #hnf-panel-exercises .hnf-exercise-library-hero p{font-size:10px!important} #hnf-panel-exercises .hnf-exercise-hero-mark{width:62px;height:62px;flex-basis:62px} #hnf-panel-exercises .hnf-exercise-hero-mark strong{font-size:19px} #hnf-panel-exercises .hnf-exercise-library-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} #hnf-panel-exercises .hnf-exercise-library-stats>div{padding:11px;border-radius:12px} #hnf-panel-exercises .hnf-exercise-library-stats strong{font-size:19px} #hnf-panel-exercises .hnf-exercise-library-head{align-items:flex-end!important;gap:8px!important} #hnf-panel-exercises .hnf-exercise-library-head>div{min-width:0!important} #hnf-panel-exercises .hnf-exercise-library-head button{width:auto!important;min-width:112px!important} #hnf-panel-exercises .hnf-exercise-tools{grid-template-columns:1fr!important;padding:10px!important;gap:8px!important} #hnf-panel-exercises #hnf-exercises-list{grid-template-columns:1fr!important;gap:10px!important} #hnf-panel-exercises .hnf-exercise-card-v3{border-radius:14px!important} #hnf-panel-exercises .hnf-exercise-media{aspect-ratio:2/1} #hnf-panel-exercises .hnf-exercise-card-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important} } @media (max-width:420px){ #hnf-panel-exercises .hnf-exercise-library-hero p{max-width:220px} #hnf-panel-exercises .hnf-exercise-card-actions{grid-template-columns:1fr 1fr!important} #hnf-panel-exercises .hnf-exercise-card-actions a{grid-column:1/-1!important} } /* v6.5.12 Exercise catalogue expansion */ .hnf-exercise-library-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .hnf-exercise-library-actions button{white-space:nowrap} .hnf-exercise-media img[hidden]{display:none!important} .hnf-exercise-broken-fallback[hidden]{display:none!important} @media(max-width:700px){.hnf-exercise-library-actions{width:100%}.hnf-exercise-library-actions button{flex:1 1 150px}} /* v6.5.13 Supabase exercise media management */ .hnf-exercise-media-form{margin:12px 0;padding:14px;border:1px solid rgba(139,92,246,.32);border-radius:14px;background:rgba(88,28,135,.08);display:grid;gap:8px} .hnf-exercise-media-form>strong{font-size:14px} .hnf-exercise-media-form>small{color:var(--hnf-muted,#9ca3af);line-height:1.45} .hnf-exercise-media-form label span{font-weight:400;opacity:.7} .hnf-exercise-media-form input[type=file]{padding:10px;border:1px dashed rgba(139,92,246,.45);border-radius:10px;background:rgba(255,255,255,.025)} .hnf-exercise-media-form a{font-size:12px;color:#b794f6;text-decoration:none} .hnf-exercise-media-badges .is-storage{background:rgba(16,185,129,.17);border-color:rgba(16,185,129,.45);color:#6ee7b7} /* ========================================================= v6.5.14 Exercise Library offline quality pass No schema changes: improves catalogue scanning and media QA. ========================================================= */ #hnf-panel-exercises .hnf-exercise-tools{ grid-template-columns:minmax(230px,1.55fr) repeat(3,minmax(135px,.7fr))!important; position:sticky;top:8px;z-index:8; box-shadow:0 10px 30px rgba(0,0,0,.28); backdrop-filter:blur(16px); } #hnf-panel-exercises .hnf-exercise-card-v3{ transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; } @media (hover:hover){ #hnf-panel-exercises .hnf-exercise-card-v3:hover{ transform:translateY(-2px);border-color:rgba(139,92,246,.52); box-shadow:0 14px 34px rgba(0,0,0,.28); } } #hnf-panel-exercises .hnf-exercise-card-copy strong{ display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } #hnf-panel-exercises .hnf-exercise-media.no-image::after{ content:'ADD MEDIA';position:absolute;right:9px;bottom:9px; padding:4px 7px;border-radius:999px;font-size:7px;font-weight:900;letter-spacing:.1em; color:#d8ccff;background:rgba(80,45,145,.72);border:1px solid rgba(174,139,255,.38); } #hnf-panel-exercises .hnf-exercise-media.has-image::after{ content:'MEDIA READY';position:absolute;right:9px;bottom:9px; padding:4px 7px;border-radius:999px;font-size:7px;font-weight:900;letter-spacing:.1em; color:#9ff4cf;background:rgba(6,78,59,.72);border:1px solid rgba(52,211,153,.35); } #hnf-panel-exercises .hnf-exercise-details>summary{cursor:pointer} #hnf-panel-exercises .hnf-exercise-card-actions .danger{opacity:.78} #hnf-panel-exercises .hnf-exercise-card-actions .danger:hover{opacity:1} @media(max-width:1180px){ #hnf-panel-exercises .hnf-exercise-tools{grid-template-columns:repeat(2,minmax(0,1fr))!important;position:static} } @media(max-width:900px){ #hnf-panel-exercises .hnf-exercise-tools{grid-template-columns:1fr!important;position:static!important;box-shadow:none} #hnf-panel-exercises .hnf-exercise-media.no-image::after,#hnf-panel-exercises .hnf-exercise-media.has-image::after{font-size:6px} } \n\n/* =========================================================\n v6.5.15 Supabase exercise-media live readiness\n ========================================================= */\n.hnf-exercise-storage-check{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 18px;padding:14px 16px;border:1px solid rgba(139,92,246,.23);border-radius:16px;background:linear-gradient(135deg,rgba(139,92,246,.08),rgba(12,12,18,.92));box-shadow:0 12px 32px rgba(0,0,0,.16)}\n.hnf-exercise-storage-check>div:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}\n.hnf-exercise-storage-check strong{font-size:.9rem;letter-spacing:.01em}\n.hnf-exercise-storage-check span:not(.hnf-storage-badge){font-size:.76rem;color:rgba(255,255,255,.58);line-height:1.45}\n.hnf-exercise-storage-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}\n.hnf-storage-badge{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-size:.68rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}\n.hnf-storage-badge.is-idle{background:rgba(255,255,255,.045);color:rgba(255,255,255,.58)}\n.hnf-storage-badge.is-checking{background:rgba(139,92,246,.12);border-color:rgba(139,92,246,.36);color:#c9b6ff}\n.hnf-storage-badge.is-ok{background:rgba(34,197,94,.11);border-color:rgba(34,197,94,.34);color:#86efac}\n.hnf-storage-badge.is-error{background:rgba(239,68,68,.10);border-color:rgba(239,68,68,.34);color:#fca5a5}\n@media(max-width:760px){.hnf-exercise-storage-check{align-items:flex-start;flex-direction:column}.hnf-exercise-storage-actions{width:100%;justify-content:space-between}.hnf-exercise-storage-actions button{min-height:38px}}\n/* v6.6.0 Exercise Media Bulk Importer */ .hnf-media-importer{margin:18px 0;padding:18px;border:1px solid rgba(168,85,247,.28);border-radius:18px;background:rgba(15,10,28,.72)} .hnf-media-import-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.hnf-folder-picker{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px dashed rgba(192,132,252,.55);border-radius:12px;cursor:pointer}.hnf-folder-picker input{max-width:260px} .hnf-media-import-results{display:grid;gap:8px;margin-top:12px;max-height:560px;overflow:auto}.hnf-media-match{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center;padding:10px;border-radius:12px;background:rgba(255,255,255,.035);border-left:3px solid #666}.hnf-media-match.exact{border-left-color:#43d17d}.hnf-media-match.suggested{border-left-color:#eab54d}.hnf-media-match.unmatched{border-left-color:#e45b67}.hnf-media-match small{display:block;opacity:.7;overflow-wrap:anywhere}@media(max-width:700px){.hnf-media-match{grid-template-columns:auto 1fr}.hnf-media-match>span{display:none}.hnf-media-match>div:last-child{grid-column:2}.hnf-media-import-actions>*{width:100%}} /* v6.6.2 exact-name override + Spanish alias matcher */ .hnf-media-match.exact{border-left:3px solid rgba(34,197,94,.72)} .hnf-media-match.suggested{border-left:3px solid rgba(245,158,11,.78)} .hnf-media-match.unmatched{border-left:3px solid rgba(239,68,68,.68)} .hnf-media-match small{line-height:1.38} /* v6.6.3 Exercise Media Visual Review */ .hnf-media-review-tools{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:14px 0 8px}.hnf-media-review-tools label{display:grid;gap:5px;min-width:170px}.hnf-media-review-tools label>span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.hnf-media-review-note{margin:8px 0 14px;padding:10px 12px;border:1px solid rgba(151,87,255,.28);border-radius:12px;background:rgba(151,87,255,.06);font-size:13px;color:#cfc8dc}.hnf-media-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-height:980px;overflow:auto;padding-right:4px}.hnf-media-review-card{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;border:1px solid rgba(255,255,255,.09);border-left:4px solid #8b5cf6;border-radius:14px;background:#17161f;overflow:hidden;min-height:190px}.hnf-media-review-card.suggested{border-left-color:#f59e0b}.hnf-media-review-card.unmatched{border-left-color:#ef4444}.hnf-media-review-preview{position:relative;background:#0b0a10;display:flex;align-items:center;justify-content:center;min-height:190px}.hnf-media-review-preview img{width:100%;height:100%;min-height:190px;max-height:235px;object-fit:contain;background:#fff}.hnf-media-confidence{position:absolute;right:8px;top:8px;padding:4px 7px;border-radius:999px;background:rgba(12,10,18,.88);font-weight:800;font-size:11px;color:#fff}.hnf-media-review-body{padding:12px 12px 12px 0;display:flex;flex-direction:column;gap:8px;min-width:0}.hnf-media-review-file strong{display:block;font-size:15px;overflow-wrap:anywhere}.hnf-media-review-file small{display:block;opacity:.55;font-size:10px;overflow-wrap:anywhere;margin-top:4px}.hnf-media-review-arrow{font-size:10px;text-transform:uppercase;letter-spacing:.09em;opacity:.55}.hnf-media-match-select{display:grid;gap:4px}.hnf-media-match-select>span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;opacity:.65}.hnf-media-match-select select{width:100%;min-width:0}.hnf-media-review-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.hnf-media-review-meta small{opacity:.62;font-size:10px}.hnf-media-status-pill{font-size:10px;padding:4px 7px;border-radius:999px;background:rgba(139,92,246,.16);color:#c4b5fd}.hnf-media-status-pill.suggested{background:rgba(245,158,11,.14);color:#fbbf24}.hnf-media-status-pill.unmatched{background:rgba(239,68,68,.14);color:#fca5a5}.hnf-media-approve-check{margin-top:auto;display:flex;align-items:flex-start;gap:8px;padding:8px;border-radius:9px;background:rgba(255,255,255,.035);font-size:12px}.hnf-media-approve-check input{margin-top:2px}.hnf-media-review-count{grid-column:1/-1;padding:8px}.hnf-media-preview-missing{font-size:12px;opacity:.55}@media(max-width:1100px){.hnf-media-review-grid{grid-template-columns:1fr}.hnf-media-review-card{grid-template-columns:160px minmax(0,1fr)}}@media(max-width:640px){.hnf-media-review-card{grid-template-columns:1fr}.hnf-media-review-preview,.hnf-media-review-preview img{min-height:220px;max-height:280px}.hnf-media-review-body{padding:12px}.hnf-media-review-tools>*{width:100%}} /* v6.6.4 approval button hotfix */ #hnf-media-approve-visible{pointer-events:auto!important;position:relative;z-index:3;touch-action:manipulation;} #hnf-media-approve-visible:disabled{opacity:.78;cursor:wait;} /* v6.6.5 100% approval + uploaded status */ .hnf-media-review-preview{position:relative} .hnf-media-uploaded-badge{position:absolute;left:10px;bottom:10px;z-index:3;padding:5px 9px;border-radius:999px;background:rgba(18,110,64,.94);color:#fff;font-size:10px;font-weight:800;letter-spacing:.06em;box-shadow:0 4px 14px rgba(0,0,0,.24)} .hnf-media-approve-check.is-uploaded{opacity:.72} .hnf-media-approve-check.is-uploaded span{font-weight:700} /* v6.6.7 media completion workflow */ #hnf-panel-exercises .hnf-exercise-media-badges .is-missing-media{background:rgba(245,158,11,.16);border-color:rgba(245,158,11,.42);color:#fbbf24} #hnf-panel-exercises .hnf-exercise-media.has-image .hnf-exercise-img{object-fit:contain;background:#fff} #hnf-panel-exercises .hnf-exercise-media{background:#0b0a10} .hnf-media-review-card .hnf-media-uploaded-badge{position:absolute;left:8px;bottom:8px;padding:5px 8px;border-radius:999px;background:#087f5b;color:#fff;font-size:10px;font-weight:900;letter-spacing:.04em} /* v6.6.8 trainer-verified 90–99% media workflow */ .hnf-media-manual-verify{border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.07)} .hnf-media-manual-verify span{font-weight:700;color:#fde68a} #hnf-media-upload-verified:disabled{opacity:.45;cursor:not-allowed} \n/* v6.7.0 Media-First Exercise Library Builder */ .hnf-media-first-builder{margin:18px 0;padding:16px;border:1px solid rgba(147,92,255,.38);border-radius:16px;background:linear-gradient(135deg,rgba(74,34,120,.18),rgba(12,11,21,.86))} .hnf-media-first-head{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}.hnf-media-first-head>div:first-child{display:flex;flex-direction:column;gap:4px}.hnf-media-first-head span{color:#aaa3b8;font-size:13px}.hnf-media-first-actions,.hnf-media-first-tools{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.hnf-media-first-tools{margin-top:14px}.hnf-media-first-tools label{display:flex;flex-direction:column;gap:5px}.hnf-media-first-tools label span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#aaa3b8}.hnf-media-first-results{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hnf-media-first-note{grid-column:1/-1;padding:10px 12px;border-radius:10px;background:rgba(139,82,246,.1);color:#cfc8dc}.hnf-media-first-card{display:grid;grid-template-columns:180px minmax(0,1fr);min-height:250px;border:1px solid rgba(148,105,255,.28);border-radius:14px;overflow:hidden;background:#13121b}.hnf-media-first-preview{background:#fff;display:flex;align-items:center;justify-content:center;min-height:220px}.hnf-media-first-preview img{width:100%;height:100%;max-height:300px;object-fit:contain}.hnf-media-first-copy{padding:14px;display:flex;flex-direction:column;gap:9px}.hnf-media-first-copy small{color:#9d97a8;word-break:break-word}.hnf-media-first-copy label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#bdb6ca}.hnf-media-first-copy input,.hnf-media-first-copy textarea{width:100%}.hnf-mf-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hnf-media-first-state{align-self:flex-start;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:800;letter-spacing:.06em}.hnf-media-first-state.is-ready{background:rgba(41,190,116,.18);color:#7df0ad}.hnf-media-first-state.is-existing{background:rgba(88,153,255,.16);color:#a9cbff}.hnf-media-first-state.is-review{background:rgba(255,184,55,.16);color:#ffd17d}.hnf-mf-existing{padding:8px;border-radius:8px;background:rgba(91,72,130,.2);font-size:12px}.hnf-mf-select{margin-top:auto;padding:9px;border-radius:9px;background:rgba(139,82,246,.12);flex-direction:row!important;align-items:center}.hnf-mf-select input{width:auto!important}.hnf-media-first-copy details summary{cursor:pointer;color:#cdb7ff;font-weight:700} @media(max-width:900px){.hnf-media-first-results{grid-template-columns:1fr}.hnf-media-first-card{grid-template-columns:1fr}.hnf-media-first-preview{min-height:200px}.hnf-mf-grid{grid-template-columns:1fr}.hnf-media-first-actions,.hnf-media-first-tools{width:100%}.hnf-media-first-actions button,.hnf-media-first-tools button{flex:1 1 auto}} /* v6.7.1 Media-First Library Review & Safety */ .hnf-media-first-progress{margin:12px 0;padding:12px 14px;border:1px solid rgba(139,82,246,.28);border-radius:12px;background:rgba(139,82,246,.08);display:flex;flex-direction:column;gap:5px}.hnf-media-first-progress span{color:#aaa3b8;font-size:12px}.hnf-mf-progress-track{height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:4px}.hnf-mf-progress-track i{display:block;height:100%;background:linear-gradient(90deg,#8b52f6,#c084fc);border-radius:inherit}.hnf-media-first-state.is-unclear{background:rgba(255,76,104,.15);color:#ff9aaa}.hnf-mf-blocked{margin-top:auto;padding:9px;border-radius:9px;background:rgba(255,76,104,.1);border:1px solid rgba(255,76,104,.22);color:#ffb0bd;font-size:11px;font-weight:800;letter-spacing:.03em}.hnf-mf-no-media{color:#736d7d;font-size:12px;font-weight:800;letter-spacing:.06em}.hnf-media-first-card.is-blocked{opacity:.82}.hnf-media-first-card.is-eligible{box-shadow:inset 0 0 0 1px rgba(52,211,153,.1)} /* v6.7.2 Guided Media-First Review */ .hnf-media-first-pager{margin:12px 0 4px;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}.hnf-media-first-pager strong{min-width:220px;text-align:center;color:#e8e2f3;font-size:13px}.hnf-media-first-pager button:disabled{opacity:.38;cursor:not-allowed}.hnf-media-first-card .hnf-media-first-preview{min-height:260px}.hnf-media-first-card .hnf-media-first-preview img{max-height:340px}.hnf-media-first-card .hnf-mf-select{border:1px solid rgba(52,211,153,.22)} @media(max-width:900px){.hnf-media-first-pager{position:sticky;bottom:72px;z-index:12;padding:8px;border-radius:12px;background:rgba(17,14,25,.96);backdrop-filter:blur(10px)}.hnf-media-first-pager strong{order:-1;width:100%;min-width:0}} /* v6.8.0 Smart Library Review & Autosave */ .hnf-mf-save-state{align-self:flex-start;font-size:10px;font-weight:800;letter-spacing:.04em;padding:3px 7px;border-radius:999px;background:rgba(148,163,184,.12);color:#b8b2c5;border:1px solid rgba(148,163,184,.16)} .hnf-mf-save-state[data-state="saving…"],.hnf-mf-save-state[data-state="saving"]{background:rgba(251,191,36,.12);color:#f7d77a;border-color:rgba(251,191,36,.22)} .hnf-mf-save-state[data-state="saved"],.hnf-mf-save-state[data-state="saved-correction"]{background:rgba(52,211,153,.12);color:#86efac;border-color:rgba(52,211,153,.22)}