.posting-wrapper{position:fixed;inset:0;display:flex;width:100%;height:100vh;background-color:#ffffffb0;justify-content:center;align-items:center;z-index:100;}
.posting-card{display:flex;flex-direction:column;width:500px;max-height:400px;overflow-y:auto;background:#fff;border-radius:10px;border:1px solid #eee;box-shadow:1px 2px 5px #ddd;}
.posting-card-content>.textarea{display:inline-block;background-color:#fff;width:100%;}
.posting-card-content>.textarea textarea{display:flex;margin-top:8px;width:100%;text-align:left;padding:10px;border:none;resize:none;font-size:16px;}
.posting-card-content>.textarea textarea:focus{border:none;outline:none;}
.posting-profile{display:flex;gap:10px;justify-content:flex-start;align-items:flex-start}
.posting-profile .avatar{width:60px;height:60px;border-radius:50%;display:block;border:1px solid #eee;overflow:hidden;}
.posting-profile img{width:100%;height:100%;object-fit:cover;}
.posting-profile span{font-size:1rem;font-weight:900;}
.posting-header{position:relative;display:flex;justify-content:center;padding:15px;border-bottom:1px solid #eee;}
.posting-header h3{text-align:center;color:#000;font-size:1rem;}
.posting-header .close{position:absolute;top:5px;right:0;cursor:pointer;}
.posting-card-footer{padding:10px;width:100%;}
.posting-card-footer .button-posting{width:100%;padding:10px 5px;background:rgb(39,112,196);color:#fff;text-align:center;border-radius:5px;font-weight:900;cursor:pointer;}
.button-posting.disabled{background:rgb(75,154,218);color:#fff;cursor:not-allowed;}
.posting-card-content{padding:10px;}
.posting-feature{display:flex;justify-content:space-between;padding:10px;border-radius:5px;border:1px solid #eee;align-items:center;}
.posting-listing-feature-button>span{cursor:pointer;font-size:2rem;color:rgb(75,72,72);}
.posting-listing-feature-button>span:hover{color:rgb(0,0,0);}
dropdown{display:inline-block;position:relative;}
.dd-button{display:inline-block;font-size:11px;border:1px solid gray;border-radius:2px;padding:2px 15px 2px 5px;background-color:#ffffff;cursor:pointer;white-space:nowrap;}
.dd-button:after{content:'';position:absolute;top:50%;right:5px;transform:translateY(-50%);width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid black;}
.dd-button:hover{background-color:#eeeeee;}
.dd-input{display:none;}
.dd-menu{position:absolute;top:100%;border:1px solid #ccc;border-radius:4px;padding:0;margin:2px 0 0 0;box-shadow:0 0 6px 0 rgba(0,0,0,0.1);background-color:#ffffff;list-style-type:none;}
.dd-input+.dd-menu{display:none;}
.dd-input:checked+.dd-menu{display:block;}
.dd-menu li{padding:10px 20px;cursor:pointer;white-space:nowrap;}
.dd-menu li:hover{background-color:#f6f6f6;}
.dd-menu li a{display:block;margin:-10px -20px;padding:10px 20px;}
.dd-menu li.divider{padding:0;border-bottom:1px solid #cccccc;}
.d-block{display:block;}
.posting-listing-feature-button{display:flex;justify-content:flex-start;gap:10px;}
.upload-container{width:100%;position:relative;background:#f1f1f1;border:2px solid #eee;height:auto;min-height:200px;z-index:99;padding:10px;border-radius:10px;margin:20px 0px;}
.upload-container input{display:none;}
.upload-preview-area{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:1fr;}
/* width */
::-webkit-scrollbar{width:10px;}
/* Track */
::-webkit-scrollbar-track{background:#f1f1f1;}
/* Handle */
::-webkit-scrollbar-thumb{background:#888;}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover{background:#555;}
.info_upload{transform:translateY(50%);width:100%;height:100%;inset:0;text-align:center;}
.info_upload .small{font-size:12px;color:#bbb;}
.clear_close_images{background:#fff;height:35px;width:35px;border-radius:50%;display:flex;justify-content:center;align-items:center;text-align:center;opacity:.7;cursor:pointer;transition:all .5s;}
.clear_close_images:hover{opacity:1;}
.upload-wrapper{position:relative;}
.upload-header{display:flex;justify-content:space-between;padding:10px;align-items:center;position:absolute;top:0;z-index:9999;width:100%;}
.upload-header .btn-group{display:flex;justify-content:flex-start;gap:20px;}
.btn-group .material-icons{font-size:20px !important;}
.btn-group > div{display:flex;gap:3px;align-items:center;cursor:pointer;background:#fff;padding:5px 10px;border-radius:5px;}