:root{--primary-bg: #ffffff;--text-light: #1e293b;--text-primary: #1e293b;--text-secondary: #475569;--form-bg: #f8fafc;--form-border: #cbd5e1;--form-label-color: #334155;--card-bg: #f1f5f9;--card-border: #cbd5e1;--navbar-bg: #e2e8f0;--button-blue: #3b82f6;--button-blue-hover: #2563eb;--success-color: #10b981;--error-color: #ef4444;--error-text: #dc2626;--button-text: #ffffff;--overlay-backdrop: rgba(0, 0, 0, .5);--overlay-bg: #ffffff;--icon-color: #171f29}.dark{--primary-bg: #0f172a;--text-light: #f8fafc;--text-primary: #f8fafc;--text-secondary: #94a3b8;--form-bg: #1e293b;--form-border: #334155;--form-label-color: #cbd5e1;--card-bg: #1e293b;--card-border: #334155;--navbar-bg: #1e293b;--button-blue: #3b82f6;--button-blue-hover: #2563eb;--success-color: #10b981;--error-color: #ef4444;--error-text: #f87171;--button-text: #ffffff;--overlay-backdrop: rgba(255, 255, 255, .1);--overlay-bg: #212630;--icon-color: #f8fafc}*{margin:0;padding:0;box-sizing:border-box;font-family:Helvetica}html,body{height:100%;width:100%}.login-section{background-color:var(--primary-bg);width:100vw;height:100vh}.login-form{padding:30px;background-color:var(--form-bg);border-radius:9px;color:var(--text-light);position:relative;top:100px;margin:auto;width:400px;height:auto}.form-heading{text-align:center;margin-bottom:20px;font-size:2rem}.form-container{display:flex;flex-direction:column}.radio-wrapper{display:flex;gap:5px}.form-label{font-size:1rem;margin:10px 0;font-weight:600}.form-input{font-size:.9rem;width:100%;padding:8px;margin:5px 0;border-radius:4px}.form-errors{font-size:.8rem;font-weight:500;color:var(--error-text)}.btn-wrapper{display:flex;justify-content:center}.otp-container{display:flex}.otp-generate-btn{background-color:var(--error-color);border:2px solid var(--error-color);border-radius:9px;font-size:1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.otp-generate-btn:hover{color:var(--error-color);background-color:transparent}.login-form-btn{padding:10px 40px;background-color:var(--success-color);border:2px solid var(--success-color);border-radius:9px;font-size:1.1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.login-form-btn:hover{color:var(--success-color);background-color:transparent}.explore-post-section{background-color:var(--primary-bg)}.loader{margin:100px auto}.posts-container{margin:0 auto;max-width:1280px;padding:10px;display:flex;gap:20px;flex-wrap:wrap}.explore-post-heading{color:var(--text-light);padding:40px 0 20px;text-align:center;font-size:2rem;font-weight:400}.search-box{position:relative;display:flex;justify-content:flex-end;gap:10px;margin-right:130px;padding:10px 0}.search-input{outline:none;background-color:var(--form-bg);padding:5px 35px 5px 10px;border:1px solid var(--form-border);color:var(--text-light);border-radius:8px;font-size:1rem}.search-icon{color:var(--text-light);position:absolute;top:12px;font-size:1.5rem;right:10px}.post-not-found{width:100%;margin:30px;padding:20px;font-size:2rem;font-weight:600;color:var(--error-text);text-align:center}.pagination-container{margin-top:20px;padding:20px;display:flex;justify-content:center;gap:20px}.pagination-count{font-size:1.2rem;margin-top:10px;color:var(--text-light)}.pagination-btn{background-color:var(--navbar-bg);border:2px solid var(--card-bg);border-radius:8px;font-size:1.2rem;padding:5px 10px}.pagination-btn:disabled{opacity:.3;cursor:not-allowed}.pagination-btn:hover{border:2px solid var(--card-border)}.pagination-btn:active{scale:.95}.pagination-icon{color:var(--text-light);margin-top:5px}.card{display:flex;flex-direction:column;border-radius:12px;width:300px;background-color:var(--card-bg);border:2px solid var(--card-border)}.card-image{border-top-left-radius:9px;border-top-right-radius:9px;width:100%;height:200px}.card-text{padding:15px}.card-title{font-size:1.2rem;margin-bottom:5px;font-weight:400;color:var(--text-primary)}.card-description{font-size:1rem;color:var(--text-secondary)}.show-description{cursor:pointer;margin-left:5px;color:var(--success-color)}.card-edit-btn{padding:5px 20px;background-color:var(--success-color);border:2px solid var(--success-color);border-radius:9px;font-size:1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.card-delete-btn{padding:5px 20px;background-color:var(--error-color);border:2px solid var(--error-color);border-radius:9px;font-size:1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.card-edit-btn:hover{color:var(--success-color);background-color:transparent}.card-delete-btn:hover{color:var(--error-color);background-color:transparent}.icon-wrapper{margin-bottom:20px;display:flex;justify-content:space-around}.edit-icon,.delete-icon{font-size:1.6rem;color:var(--icon-color)}.created-post-section{background-color:var(--primary-bg)}.no-post-created{padding:30px;width:100%;font-size:2rem;text-align:center;color:var(--error-text);font-weight:600}.page-not-found{text-align:center;margin-top:20%;font-size:2rem;color:var(--error-color);font-weight:600}.footer{padding:30px;background-color:var(--primary-bg);color:var(--text-light)}.footer-text{text-align:center;font-size:1rem;font-weight:200}.navbar{display:flex;padding:15px;color:var(--text-light);background-color:var(--navbar-bg);gap:50px;justify-content:space-evenly;align-items:center}.logo-wrapper{display:flex;gap:10px;align-items:center;text-decoration:none}.logo{width:40px;cursor:pointer}.nav-item{font-size:1.2rem;text-decoration:none;font-weight:400;color:var(--text-light)}.navbar-btn-wrapper{display:flex;align-items:center}.theme-toggle-btn{margin-right:20px;background:none;border:none;color:var(--icon-color);cursor:pointer;transition:color .3s ease}.theme-toggle-btn:hover{color:var(--button-blue-hover)}.navbar-btn{padding:10px 30px;background-color:var(--error-color);border:2px solid var(--error-color);border-radius:9px;font-size:1rem;color:var(--button-text);cursor:pointer;transition:ease .3s;text-decoration:none}.navbar-btn:hover{color:var(--error-color);background-color:transparent}.backdrop{background-color:var(--overlay-backdrop);height:100vh;width:100vw;position:fixed;left:0;top:0;z-index:10;opacity:.75}.overlay-wrapper{background-color:var(--overlay-bg);border-radius:10px;height:250px;width:550px;position:fixed;top:35%;left:50%;padding:30px;transform:translate(-50%,-50%);z-index:999}.overlay-heading{font-size:1.5rem;font-weight:400}.btn-group{display:flex;gap:20px;justify-content:end;margin-top:130px}.btn-cancel{padding:10px 30px;background-color:var(--success-color);border:2px solid var(--success-color);border-radius:9px;font-size:1.1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.btn-logout{padding:10px 30px;background-color:var(--error-color);border:2px solid var(--error-color);border-radius:9px;font-size:1.1rem;color:var(--text-light);cursor:pointer;transition:ease .3s;text-decoration:none}.btn-cancel:hover{color:var(--success-color);background-color:transparent}.btn-logout:hover{color:var(--error-color);background-color:transparent}.create-post-section{padding:1rem;background-color:var(--primary-bg);height:100vh;overflow:hidden}.create-post-form{padding:2rem;background-color:var(--form-bg);max-width:600px;margin:30px auto;border-radius:8px;display:flex;flex-direction:column;gap:20px}.create-post-form-heading{text-align:center;font-size:2rem;font-weight:400;color:var(--text-light)}.form-wrapper{display:flex;flex-direction:column}.create-post-form-label{color:var(--form-label-color);font-size:1.2rem;margin-bottom:5px}.image-input{color:var(--text-light)}.create-post-form-input{padding:10px;font-size:1.2rem;border:2px solid var(--form-border);border-radius:8px}.create-post-form-error{color:var(--error-text);margin:5px 0 0;font-size:.9rem}.btn-wrapper{margin:10px 0 auto}.create-post-form-btn{cursor:pointer;padding:10px 30px;border:none;border-radius:8px;font-size:1rem;font-weight:400;background-color:var(--button-blue);color:var(--text-light)}.create-post-form-btn:hover{background-color:var(--button-blue-hover)}.post-detail-wrapper{background-color:var(--primary-bg);display:flex;gap:2rem;padding:6rem;flex-wrap:wrap;justify-content:center}.post-preview{flex:1;max-width:400px;padding:1rem;border:2px solid var(--card-border);border-radius:12px;background-color:var(--card-bg);color:var(--text-primary);text-align:center}.post-preview h2{margin-bottom:1rem;color:var(--text-primary)}.post-preview-image{width:100%;max-height:200px;object-fit:cover;margin-bottom:1rem;border-radius:10px}.post-preview-title{font-size:1.5rem;margin:.5rem 0;color:var(--text-primary)}.post-preview-description{color:var(--text-secondary);font-size:1rem}.post-detail-form{flex:1;max-width:500px;padding:1.5rem;border:2px solid var(--card-border);border-radius:12px;background-color:var(--card-bg);color:var(--text-primary)}.post-detail-form h2{margin-bottom:1.5rem;text-align:center;color:var(--text-primary);font-size:2rem}.post-detail-form div{margin-bottom:1rem;display:flex;flex-direction:column}.post-detail-form label{font-weight:600;margin-bottom:.5rem;color:var(--form-label-color)}.post-detail-form input[type=text],.post-detail-form textarea,.post-detail-form input[type=file]{padding:.5rem;font-size:1rem;border:2px solid var(--form-border);border-radius:8px;background-color:transparent;color:var(--text-primary)}.post-detail-form textarea{min-height:100px;resize:vertical}.form-error{color:var(--error-color);font-size:.875rem;margin-top:.25rem}.post-detail-btn-wrapper{display:flex;justify-content:space-between;gap:1rem;margin-top:1.5rem}.post-detail-btn-wrapper button{padding:.75rem 1.5rem;font-size:1rem;border-radius:9px;cursor:pointer;transition:all .3s ease-in-out;font-weight:600;border:2px solid transparent}.post-detail-btn-wrapper button[type=button]{background-color:var(--error-color);color:var(--text-light);border-color:var(--error-color)}.post-detail-btn-wrapper button[type=button]:hover{background-color:transparent;color:var(--error-color)}.post-detail-btn-wrapper button[type=submit]{background-color:var(--success-color);color:var(--text-light);border-color:var(--success-color)}.post-detail-btn-wrapper button[type=submit]:hover{background-color:transparent;color:var(--success-color)}