@charset "UTF-8";.home{font-family:Arial,sans-serif;padding:20px}.home-header{text-align:center;margin-bottom:40px}.home-header h1{font-size:2.5rem;margin-bottom:10px}.home-header p{color:#555;font-size:1.2rem}.home-header__create-article button{padding:10px 20px 10px 10px;font-size:16px;color:#fff;background-color:#007bff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s;width:170px;height:auto}.home-header__create-article button:hover{background-color:#0062cc}.home-main{display:flex;flex-direction:column;align-items:center}.articles-list{display:grid;grid-template-columns:1fr;width:95%}.article-card{background:#f2f2f2;padding:20px;border-radius:8px;box-shadow:0 2px 5px #0000001a;transition:box-shadow .3s ease;text-align:center}.article-card:hover{box-shadow:0 4px 10px #00000026}.article-card h2{font-size:1.5rem;margin-bottom:10px}.article-card p{color:#555;margin-bottom:15px}.article-footer{display:flex;justify-content:space-between;font-size:.9rem;color:#777}.create-article-button{background-color:#4caf50;color:#fff;padding:10px 20px;border:none;border-radius:5px;font-size:16px;cursor:pointer;transition:background-color .3s;margin-top:10px}.create-article-button:hover{background-color:#3d8b40}.article-card-link{text-decoration:none;color:#000}.article-card-link .article-card{display:flex;justify-content:space-between;align-items:center;width:95%;height:auto;min-height:150px;background:#f9f4f4;border-radius:12px;box-shadow:0 4px 8px #0000001a;padding:15px;margin:15px auto;gap:15px}.article-card-link .article-card .title-description-footer{flex:2;display:flex;flex-direction:column;justify-content:space-between}.article-card-link .article-card .article-image{flex:.5;display:flex;justify-content:center;align-items:center}.article-card-link .article-card img{width:100%;height:150px;border-radius:8px}.article-card-link .article-card .no-image{font-size:14px;color:#888;text-align:center}.article-card-link .article-card .article-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px;margin-right:10%;font-size:14px}.article-card-link .article-card p{margin:5px 0}.article-card-link .article-card a{display:inline-block;margin-top:10px;padding:8px 12px;background:#007bff;color:#fff;text-decoration:none;border-radius:6px;transition:background .3s ease}.article-card-link .article-card:hover{background:#0056b3}.article-card-link .article-card .article-card-tags{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;color:#333}.article-card-link .article-card strong{font-weight:700}.article-card-link .article-card .tag{background-color:#e0e0e0;padding:5px 12px;border-radius:10px;font-size:14px;color:#333;text-transform:capitalize;white-space:nowrap}.article-card-link .article-card .tag:hover{background-color:#70b4fd;color:#fff;cursor:pointer}.article-card-link .article-card:hover{background-color:#d4e9ff;cursor:pointer}.login-form{width:100%;max-width:400px;margin:50px auto;padding:20px;background-color:#f9f9f9;box-shadow:0 4px 8px #0000001a;border-radius:10px;text-align:center;font-family:Arial,sans-serif}.login-form h2{margin-bottom:20px;color:#333}.login-form input{width:100%;padding:10px;margin:10px 0;border:1px solid #ddd;border-radius:5px;font-size:1rem}.login-form button{width:100%;padding:10px;background-color:#07c;color:#fff;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.login-form button:hover{background-color:#005fa3}.login-form button[type=button]{background-color:#f5f5f5;color:#333;margin-top:10px}.login-form button[type=button]:hover{background-color:#ddd}.login-form .error{color:red;margin-top:10px;font-size:.9rem}.login-form .logged-in{margin-top:15px;font-weight:700;color:green}.login-form .logged-in .user-email{color:#000;font-weight:700;text-decoration:underline}@media (max-width: 480px){.login-form{width:90%;padding:15px}.login-form h2{font-size:1.5rem}}.header{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background-color:#f5f5f5;border-bottom:2px solid #ddd;font-family:Arial,sans-serif}.header__left{display:flex;justify-content:flex-start;gap:15px}.header__right{display:flex;justify-content:flex-end}.header__user{display:flex;align-items:center;gap:15px}.header .header__button,.header .header__admin{padding:10px 20px 10px 10px;font-size:16px;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.header__button{background-color:#007bff}.header__button:hover{background-color:#0056b3}.header__admin{background-color:#2a00b3}.header__admin:hover{background-color:#9254de}.header .user-info{font-size:20px;font-weight:600;text-decoration:underline}.header .user-info p{color:#010d94;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.header button{background-color:#ff4d4f;color:#fff;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.header button:hover{background-color:#ff7875}.header button svg{font-size:20px;color:#fff}.footer{display:flex;justify-content:center;align-items:center;padding:0;background-color:#f5f5f5;border-top:2px solid #ddd;position:fixed;bottom:0;width:100%;font-family:Arial,sans-serif;font-size:20px;color:#555;height:6%;gap:15px}.footer__center{display:flex;justify-content:center;align-items:center;text-align:center}.main-content{padding-bottom:3%}.article{width:93%;margin:40px auto;padding:25px;background:#fff;box-shadow:0 4px 12px #0000001a;border-radius:12px;font-family:Arial,sans-serif;transition:box-shadow .3s ease-in-out}.article:hover{box-shadow:0 6px 15px #00000026}.article-title{font-size:2.5rem;font-weight:700;color:#222;text-align:center;text-transform:capitalize;margin-bottom:20px}.article-description{font-size:1.2rem;color:#444;line-height:1.8;margin-bottom:25px;text-align:justify;padding:15px;background:#f0f8ff;border-left:6px solid #0077cc;border-radius:8px;box-shadow:0 2px 6px #00000014;font-style:italic}.article-content{font-size:1.1rem;color:#333;line-height:1.7;margin-top:15px;word-wrap:break-word}.article-content p{margin-bottom:1rem}.article-content strong{font-weight:700}.article-content em{font-style:italic}.article-image{width:100%;height:auto;max-height:300px;object-fit:contain;border-radius:8px;display:block;margin:10px 0}.article-title-container{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:10px}.article-title-container .article-title{flex:0 0 97%;margin:0}.article-title-container .heart-icon{width:10%;max-width:40px;cursor:pointer;transition:transform .3s ease-in-out}.article-title-container .heart-icon:hover{transform:scale(1.2)}.article-title-container .like-button{flex:0 0 3%;font-size:2.5rem;font-weight:400;padding:0;border:none;background:none;cursor:pointer;transition:transform .2s ease-in-out}.article-title-container .like-button:hover{background:none;transform:scale(1.2)}.line{border-bottom:3px solid #0077cc;margin:auto}button{display:inline-block;background:#07c;color:#fff;font-size:1rem;font-weight:700;padding:12px 18px;border:none;border-radius:6px;cursor:pointer;transition:all .3s ease-in-out;text-align:center;box-shadow:0 3px 8px #0000001a}button:hover{background:#005fa3;transform:translateY(-2px)}button:active{transform:translateY(1px)}button:focus{outline:none}.edit-button{display:flex;justify-content:center;align-items:center;margin-top:20px;width:100px;margin-left:auto;margin-right:auto}.comments{width:90%;max-width:800px;margin:30px auto;padding:20px;background:#fafafa;border-radius:10px;box-shadow:0 2px 8px #0000001a}.comments h2{font-size:1.8rem;text-align:center;color:#222;margin-bottom:15px}.comments .add-comment{display:flex;flex-direction:column;gap:12px;margin-top:20px}.comments .add-comment button{width:180px;margin-left:auto;margin-right:auto}.comments .add-comment textarea{width:97%;height:100px;padding:12px;border-radius:6px;border:1px solid #ccc;font-size:1rem;resize:none;transition:border .3s ease-in-out}.comments .add-comment textarea:focus{border-color:#07c;outline:none}.comments .edit-comment{display:flex;flex-direction:column;background:#fff;padding:15px;border-radius:8px;box-shadow:0 2px 6px #0000001a}.comments .edit-comment .text-area textarea{width:100%;height:80px;padding:10px;border-radius:6px;border:1px solid #ccc;font-size:1rem;resize:none}.comments .edit-comment .save-delete-buttons{display:flex;justify-content:center;gap:12px;margin-top:10px;width:250px}.comments .edit-comment .save-delete-buttons button{padding:10px 16px;font-size:.95rem;border-radius:6px}.tags{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tags h2{font-size:1.3rem;margin:0;white-space:nowrap}.tags .tag{background-color:#389e0d;padding:5px 10px;border-radius:5px;font-size:14px}@media (max-width: 768px){.article,.comments{width:95%;padding:15px}.article-title{font-size:2rem}.article-description{font-size:1rem}button{width:100%}}.article-editor{width:97%;margin:15px auto;padding-top:10px;background-color:#f9f9f9;border:1px solid #ddd;border-radius:5px}.article-editor .title-description{display:flex;flex-direction:column}.article-editor .save-cancel-buttons{display:flex;gap:10px;width:32%;margin:10px auto}.article-editor .save-cancel-buttons button{background-color:#007bff;color:#fff;font-size:16px;font-weight:700;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.article-editor .save-cancel-buttons button:hover{background-color:#0056b3}.article-editor .uploaded-image{display:flex;justify-content:center;align-items:center;margin:10px 0}.file-upload-wrapper{display:flex;flex-direction:column;align-items:center;margin-top:10px}.file-upload-wrapper input[type=file]{display:none}.file-upload-label{display:inline-block;background-color:#007bff;color:#fff;padding:10px 20px;font-size:16px;font-weight:700;border-radius:5px;cursor:pointer;transition:background-color .3s}.file-upload-label:hover{background-color:#0056b3}.article-title{width:calc(100% - 20px);font-size:24px;font-weight:700;padding:10px;border-radius:8px 0 0 8px;border:1px solid #ddd;border-right:none;box-shadow:0 2px 5px #0000001a}.article-description{margin-top:.5%}@media (max-width: 768px){.article-description{font-size:14px;padding:12px;max-width:95%}}.visibility-toggle{margin-right:20px}.visibility-toggle .switch{position:relative;display:inline-block;width:70px;height:34px}.visibility-toggle .switch input{opacity:0;width:0;height:0}.visibility-toggle .switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#525252;transition:.4s;border-radius:34px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff}.visibility-toggle .switch .slider:before{content:"🤫";font-size:x-large;position:absolute;display:flex;align-items:center;justify-content:center;width:28px;height:28px;left:4px;bottom:3px;color:#000;border-radius:50%;transition:.4s}.visibility-toggle .switch input:checked+.slider{background-color:#56c15a}.visibility-toggle .switch input:checked+.slider:before{content:"🌎";font-size:x-large;transform:translate(36px)}span{font-size:16px;font-weight:600;color:#fff;padding:0 5px}.image-and-toggle{display:flex;justify-content:space-between;align-items:center}.tag-selector{margin-bottom:20px}.tag-selector h3{text-align:center}.tag-selector .available-tags{display:flex;align-items:center;gap:10px;justify-content:center;margin:10px}.tag-selector .available-tags .tag-button{padding:8px 12px;border:1px solid #ccc;background:#f9f9f9;cursor:pointer;border-radius:5px;color:#4640ff;height:40px;transition:background .3s,color .3s}.tag-selector .available-tags .tag-button.selected{background:#007bff;color:#fff}.tag-selector .custom-selected-tags{display:flex;flex-wrap:wrap}.tag-selector .custom-selected-tags .custom-tag{display:flex;justify-content:center;align-items:center;gap:5px;margin-top:10px;margin-left:10px}.tag-selector .custom-selected-tags .custom-tag input{width:300px;padding:8px;border:1px solid #ccc;border-radius:5px}.tag-selector .custom-selected-tags .custom-tag button{padding:8px 12px;width:100px;border:none;background-color:#007bff;color:#fff;border-radius:5px;cursor:pointer;transition:background .3s}.tag-selector .custom-selected-tags .custom-tag button:hover{background-color:#0056b3}.tag-selector .custom-selected-tags .selected-tags{display:flex;align-items:center;margin-left:3%;margin-top:15px;text-align:center}.tag-selector .custom-selected-tags .selected-tags .selected-tag{background:#007bff;color:#fff;padding:10px;border-radius:5px;display:inline-flex;align-items:center;gap:5px;margin:5px;border:1px solid #ccc;white-space:nowrap}.tag-selector .custom-selected-tags .selected-tags .selected-tag .remove-tag-btn{background:none;border:none;color:#fff;font-size:14px;cursor:pointer;margin-left:5px;padding:0;display:flex;align-items:center}.tag-selector .custom-selected-tags .selected-tags .selected-tag .remove-tag-btn:hover{color:#ff4d4d}.tag-selector .no-tags{margin-left:10px}.comment-card{background:#f9f9f9;padding:12px 12px 15px;width:97%;margin:8px 0;border-radius:8px;box-shadow:0 2px 4px #0000001a}.comment-card .comment-text{font-size:16px;margin-bottom:8px}.comment-card .comment-footer{font-size:14px;color:#555;display:flex;justify-content:space-between}.comment-card .button-group{display:flex;gap:10px;justify-content:center;align-items:center;text-align:center;margin-top:10px}.comment-card .button-group .edit-button-card,.comment-card .button-group .delete-button-card{width:80px;padding:8px 12px 8px 0;border:none;border-radius:5px;cursor:pointer;transition:background .3s ease-in-out}.comment-card .button-group .edit-button-card.edit-button-card,.comment-card .button-group .delete-button-card.edit-button-card{background-color:#4caf50;color:#fff}.comment-card .button-group .edit-button-card.edit-button-card:hover,.comment-card .button-group .delete-button-card.edit-button-card:hover{background-color:#45a049}.comment-card .button-group .edit-button-card.delete-button-card,.comment-card .button-group .delete-button-card.delete-button-card{background-color:#f44336;color:#fff;width:100px}.comment-card .button-group .edit-button-card.delete-button-card:hover,.comment-card .button-group .delete-button-card.delete-button-card:hover{background-color:#d32f2f}.create-article-page{width:95%;margin:15px auto;padding-top:10px;background-color:#f9f9f9;border:1px solid #ddd;border-radius:5px}.create-article-page h1{text-align:center;margin-bottom:20px;margin-top:10px;font-size:2rem}.admin-container{text-align:center;padding:20px;background:#f8f9fa;border-radius:10px;max-width:400px;margin:50px auto;box-shadow:0 4px 10px #0000001a}.logout-btn{background-color:#ff4d4f!important;border-color:#ff4d4f!important;padding:20px;font-size:16px;font-weight:700;border-radius:6px;cursor:pointer;width:130px;box-shadow:0 4px 6px #0000001a;transition:all .3s ease}.logout-btn:hover{background-color:#ff3436!important;border-color:#ff1a1d!important;transform:scale(1.05)}.logout-btn:active{background-color:#ff1a1d!important;border-color:#ff0103!important;transform:scale(.98)}.logout-btn:focus{outline:none;box-shadow:0 0 8px #ff4d4f99}.logout-btn:hover{background:#c9302c}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.ant-btn-primary{background-color:#389e0d!important;border-color:#389e0d!important}.ant-btn-primary.danger-btn{background-color:#ff4d4f!important;border-color:#ff4d4f!important}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#313cff}button{background-color:#f9f9f9}}.tag-page{max-width:99%;padding:20px}.tag-page h1{font-weight:700;color:#333;text-align:center;font-size:2.5rem;margin-bottom:10px}.tag-page h1 .tag-name{color:#007bff;font-size:2.5rem;font-weight:700;background:linear-gradient(90deg,#007bff,#00b4db);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-transform:capitalize;padding:5px 10px;border-radius:8px;display:inline-block;transition:transform .3s ease}.tag-page .loading{text-align:center;font-size:1.2rem;color:#888}.tag-page .articles-container{display:grid;grid-template-columns:1fr;padding:15px;width:95%}.tag-page .no-articles{text-align:center;font-size:1.2rem;color:#666;padding:2rem}#root{height:100vh;width:100%;margin:0 auto;padding:0}