:root{--base-clr: #fefefe;--line-clr: #2c3a3e;--hover-clr: #f26f7f;--text-clr: #1e1e1e;--accent-clr: #4b7079;--secondary-text-clr: #a9a9a9}*{margin:0;padding:0;box-sizing:border-box}html{color-scheme:light dark}body{min-height:100vh}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}a{text-decoration:none;color:inherit}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}body,html{margin:0;padding:0;font-family:sans-serif;height:100%;max-width:100vw}.container{display:flex;height:100vh}.sidebar{width:200px;background-color:var(--base-clr);color:var(--text-clr);padding:1rem}.sidebar nav ul{list-style:none;padding:0}.sidebar nav ul li{margin:1rem 0}.sidebar nav ul li a{color:var(--hover-clr);text-decoration:none}#sidebar{box-sizing:border-box;height:100vh;width:200px;padding:5px,1em;background-color:var(--base-clr);border-right:1px solid var(--line-clr);position:sticky;top:0;align-self:start;transition:.3s ease-in-out;text-wrap:wrap}#sidebar .logo{font:"Poppins",sans-serif;font-size:1.5rem;margin-bottom:1rem}#sidebar.close{padding:5px;width:60px;overflow:hidden}#sidebar.close .logo{display:none}#sidebar ul{list-style:none;padding:0}#sidebar>ul>li:first-child{display:flex;justify-content:flex-end;margin-bottom:16px}#sidebar>ul>li:first-child .logo{font-weight:600}#sidebar ul li.active a{color:var(--accent-clr);svg {fill: var(--accent-clr);}}#sidebar a,#sidebar .dropdown-btn,#sidebar .logo{border-radius:.5em;padding:.85em;text-decoration:none;color:var(--text-clr);display:flex;align-items:center;gap:2em}.dropdown-btn{width:100%;text-align:left;background:none;border:none;font:inherit;cursor:pointer}#sidebar svg{flex-shrink:0;fill:var(--text-clr)}#sidebar a span,#sidebar .dropdown-btn span{flex-grow:1}#sidebar a:hover,#sidebar .dropdown-btn:hover{background-color:var(--hover-clr);color:var(--base-clr);svg {fill: var(--base-clr);}}#sidebar .sub-menu{display:grid;grid-template-rows:0fr;transition:.3s ease-in-out}#sidebar .sub-menu>div{overflow:hidden}#sidebar .sub-menu.show{grid-template-rows:1fr}.main-content{flex:1;display:flex;flex-direction:column;padding:1rem}.top-bar{display:flex;justify-content:flex-end;margin-bottom:1rem}.auth-links a{margin-left:1rem;text-decoration:none;color:#333}.hero{flex:1;display:flex;flex-direction:column;justify-content:center;background-image:url(./IMG_0643-5dd7f27d.jpg);background-size:70vh,cover;background-repeat:no-repeat;background-position:right;animation:heroFadeIn 1.5s ease-out forwards;opacity:0;padding:2rem}.hero-content{display:flex;flex-direction:column;align-items:center;width:50%}.hero h1{margin:0;font-size:2.5rem}.hero .btn{display:flex;justify-content:center;align-items:center;margin-top:1rem;padding:.75rem 1.5rem;background-color:var(--hover-clr);color:#fff;text-decoration:none;border-radius:4px;width:50%}.dropdown-btn svg{transition:.2s ease}.rotate svg:last-child{rotate:90deg}#sidebar .sub-menu a{padding-left:2em}#toggle-btn{margin-left:auto;padding:1em;border:none;border-radius:.5em;background:none;cursor:pointer;svg {transition: rotate .2s ease;}}#toggle-btn:hover{background-color:var(--hover-clr)}@keyframes heroFadeIn{0%{background-position:right top;opacity:0;transform:translateY(-50px)}to{background-position:right center;opacity:1;transform:translateY(0)}}.btn-primary{background-color:var(--hover-clr)!important;color:#fff;border:none}.btn-primary:hover{background-color:var(--base-clr)!important;color:var(--hover-clr)!important}.btn-white:hover{background-color:var(--hover-clr)!important;color:#fff!important}.border-primary{border-color:var(--hover-clr)!important}.replies{font-size:.95rem}.reply-form .form-control{font-size:.9rem}.nav-link{color:var(--text-clr)!important;text-decoration:none!important}.nav-link:hover{color:var(--line-clr)!important;text-decoration:none!important;background-color:var(--hover-clr)}.nav-link.active{color:var(--line-clr)!important;text-decoration:none!important;background-color:var(--hover-clr)!important}.nav-link.active:hover{color:var(--hover-clr)!important;text-decoration:none!important;background-color:var(--accent-clr)!important}#login{flex:1;display:flex;flex-direction:column;justify-content:center;background-image:url(./IMG_0643-5dd7f27d.jpg);background-size:70vh,cover;background-repeat:no-repeat;background-position:right;animation:heroFadeIn 1.5s ease-out forwards;opacity:0;padding:2rem}.link-text{color:var(--hover-clr);text-decoration:none}.link-text:hover{color:var(--base-clr);text-decoration-line:underline;background-color:var(--hover-clr)}.logo{background-color:#fff;padding:.5em;display:flex;justify-content:center;align-items:center;font-family:Poppins,sans-serif}.logo a{color:var(--base-clr);text-decoration:none;font-size:1.5rem}.comment-text{display:flex;font-size:.9rem;color:var(--text-clr)}.user-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover}.status-box textarea{resize:none}.timestamp{font-size:.85rem;color:gray}.post{border-left:4px solid #0d6efd;background-color:#f8f9fa}.post{border-left:3px solid var(--hover-clr)!important}.calendar-section{width:100%}.calendar-section h5{background-color:var(--hover-clr);text-align:center}.calendar-container{display:grid;grid-template-columns:repeat(auto-fit,1fr)!important;gap:1rem;justify-content:center!important;align-items:center!important;margin-top:1rem}.calendar-day{width:80px!important;height:80px!important;background-color:var(--base-clr);display:flex!important;justify-content:center!important;align-items:center!important;flex-direction:column;box-shadow:0 2px 5px #0000001a;transition:transform .3s;border-top:var(--hover-clr) 20px solid!important}.calendar-day:hover{background-color:var(--accent-clr)!important;border-top:var(--hover-clr) 10px solid!important;color:var(--base-clr);transform:translateY(-3px)}h4 span,h4{font-size:1.5rem;color:var(--text-clr);background-color:var(--hover-clr)}.card{background-color:#f9f9f9;border:1px solid #ddd;border-radius:8px;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-5px);box-shadow:0 4px 10px #0000001a}.card-title{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.card-text{font-size:.9rem;margin-bottom:.5rem}.dashboard-progress{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:2rem}.dashboard-progress .picture{display:flex;flex-direction:column;margin-bottom:1rem;width:fit-content;align-items:center;justify-content:center;text-align:center}.admin-name{background-color:var(--hover-clr);font:bolder}.profile-picture,.progress-picture{max-width:100%;height:auto;aspect-ratio:1/1;object-fit:fill}.image-preview-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000;cursor:pointer}.image-preview-modal img.full-image{max-width:90%;max-height:90%;border-radius:8px;box-shadow:0 4px 10px #00000080}.status-box{display:flex;flex-direction:column;justify-content:center;margin-top:2rem;width:100%;max-width:100%;border-left:var(--hover-clr) 4px solid}.post-box,.reply-box{display:flex;flex-direction:column;justify-content:center;margin-top:2rem;width:100%;max-width:100%}.fan-nav-container{position:fixed;bottom:1rem;left:50%;transform:translate(-50%);z-index:1050}.fan-item{position:absolute}.fan-link-label{background-color:#fffffff2!important;color:#333!important;border:1px solid rgba(0,0,0,.1);font-size:11px;font-weight:600;padding:3px 8px;border-radius:12px;text-shadow:none;box-shadow:0 2px 4px #0000001a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.fan-link{background-color:var(--hover-clr)!important;color:#fff!important;width:48px!important;height:48px!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;text-decoration:none!important;box-shadow:0 3px 8px #0003!important;transition:all .2s ease!important;border:2px solid rgba(255,255,255,.3)!important}.fan-link:hover{background-color:var(--accent-clr)!important;transform:scale(1.1)!important;box-shadow:0 4px 12px #0000004d!important}.fan-toggle{background:linear-gradient(135deg,#2f3542,#1e1e1e)!important;color:#fff!important;width:56px!important;height:56px!important;border-radius:50%!important;border:3px solid #4b7079!important;font-size:20px!important;display:flex!important;align-items:center!important;justify-content:center!important;box-shadow:0 4px 12px #0000004d!important;cursor:pointer!important;transition:all .3s ease!important}.fan-toggle:hover{transform:scale(1.05)!important;box-shadow:0 6px 16px #0006!important}/*! Small devices (phones, 576px and up) */@media (max-width: 576px){.main-content{width:70vw;height:100vh}.content{display:flex;flex-direction:column;width:100%}.content .card{width:100%}.status-box{display:flex;flex-direction:column;justify-content:center;margin-top:2rem;width:100%;max-width:100%;border-left:var(--hover-clr) 4px solid}.post-box{display:flex;flex-direction:column;justify-content:center;margin-top:2rem;width:100%;max-width:100%;font-size:1rem!important}.post-box .card-body{font-size:0rem!important}.post-box .card-title{font-size:1.2rem!important}.top-bar h4{width:fit-content}.top-bar .logo a{display:flex;justify-content:space-between;align-items:center;width:fit-content}.top-bar .logo img{width:120px}#sidebar a,#sidebar .dropdown-btn,#sidebar .logo{gap:.5em;text-wrap:wrap}#sidebar span{font-size:calc(.8rem - .5vw);overflow:hidden}.hero{background-image:url(./IMG_0643-5dd7f27d.jpg);background-size:cover;background-repeat:no-repeat;background-position:center!important;padding:2rem;animation:heroFadeIn 1.5s ease-out forwards!important}.hero-content{width:100%}.hero h1{font-size:1.5rem;background-color:var(--hover-clr)}.hero p{font-size:.9rem;background-color:var(--hover-clr)}.hero .btn{width:80%}.calendar-container{grid-template-columns:repeat(1,1fr)!important;align-items:center!important;justify-items:center!important}.calendar-day{width:50px!important;height:50px!important;background-color:var(--base-clr);display:flex!important;justify-content:center!important;align-items:center!important;flex-direction:column;box-shadow:0 2px 5px #0000001a;transition:transform .3s;border-top:var(--hover-clr) 8px solid!important}}