/* ====================================
POST FORM WRAPPER
==================================== */

.sudanads-post-form-wrapper{

    max-width:760px;

    margin:0 auto;

    padding:20px 60px 40px;

}

/* ====================================
FORM
==================================== */

.sudanads-form{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.sudanads-form{

    display:flex;

    flex-direction:column;

    gap:18px;

    padding-right:20px;

    padding-left:20px;

}

/* ====================================
FORM GROUP
==================================== */

.form-group{

    display:flex;

    flex-direction:column;

    gap:8px;

}



/* LABEL */

.form-group label{

    font-size:15px;

    font-weight:700;

    color:#111827;

}



/* INPUTS */

/* FILE INPUT */

.form-group input[type="file"]{

    width:100%;

    display:block;

    box-sizing:border-box;

    border:1px solid #E5E7EB;

    border-radius:18px;

    background:#ffffff;

    padding:14px 16px;

    font-size:15px;

    max-width:100%;

    overflow:hidden;

    cursor:pointer;

}

/* KEEP ALL FIELDS SAME WIDTH */

.form-group{

    width:100%;

}

.form-group input,
.form-group textarea,
.form-group select,
.form-group input[type="file"]{

    width:100%;

    box-sizing:border-box;

}



/* TEXTAREA */

.form-group textarea{

    min-height:150px;

    resize:vertical;

    line-height:1.8;

}



/* FOCUS */

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus{

    border-color:#16A34A;

}



/* FILE INPUT */

.form-group input[type="file"]{

    padding:14px;

    cursor:pointer;

}



/* ====================================
CURRENT GALLERY
==================================== */

.current-gallery{

    display:flex;

    gap:10px;

    flex-wrap:wrap;

    margin-top:10px;

}



.gallery-thumb{

    width:90px;

    height:90px;

    border-radius:16px;

    overflow:hidden;

    border:1px solid #E5E7EB;

}



.gallery-thumb img{

    width:100%;

    height:100%;

    object-fit:cover;

}



/* ====================================
BUTTONS
==================================== */

.form-actions{

    display:flex;

    gap:12px;

    margin-top:10px;

}



/* PRIMARY BUTTON */

.primary-btn{

    flex:1;

    height:52px;

    border:none;

    border-radius:999px;

    background:#16A34A;

    color:#ffffff;

    font-size:15px;

    font-weight:800;

    cursor:pointer;

    transition:0.2s ease;

}



/* SECONDARY BUTTON */

.secondary-btn{

    flex:1;

    height:52px;

    border:none;

    border-radius:999px;

    background:#E5E7EB;

    color:#111827;

    font-size:15px;

    font-weight:800;

    cursor:pointer;

    transition:0.2s ease;

}



/* HOVER */

.primary-btn:hover,
.secondary-btn:hover{

    opacity:0.92;

}



/* ====================================
MESSAGES
==================================== */

.dashboard-message{

    border-radius:18px;

    padding:14px 16px;

    margin-bottom:18px;

    font-size:14px;

    font-weight:700;

}



.error-message{

    background:#FEF2F2;

    border:1px solid #FECACA;

    color:#B91C1C;

}



/* ====================================
EMPTY STATE
==================================== */

.empty-state{

    background:#ffffff;

    border:1px dashed #D1D5DB;

    border-radius:24px;

    padding:40px 20px;

    text-align:center;

}



.empty-state-icon{

    font-size:42px;

    margin-bottom:14px;

}



.empty-state-title{

    font-size:22px;

    font-weight:900;

    color:#111827;

    margin-bottom:10px;

}



.empty-state-text{

    font-size:15px;

    color:#6B7280;

    line-height:1.8;

}



/* ====================================
MOBILE
==================================== */

@media(max-width:768px){

    .sudanads-post-form-wrapper{

    padding:14px 18px 40px;

   }

    .form-actions{

        flex-direction:column;

    }

    .primary-btn,
    .secondary-btn{

        width:100%;

    }

    .form-group input,
    .form-group textarea,
    .form-group select{

        font-size:14px;

    }

}

/* ====================================
CITY / CATEGORY / SUBCATEGORY
==================================== */

.form-group select{

    width:100% !important;

    height:54px;

    padding-right:20px !important;

    padding-left:45px !important;

    direction:rtl !important;

    text-align:right !important;

    appearance:auto;

    background:#fff;

    color:#111827;

    font-size:15px;

    line-height:54px;

}

/* Arabic options */

.form-group select option{

    direction:rtl;

    text-align:right;

}

/* ====================================
FULL RTL SUPPORT
==================================== */

.sudanads-post-form-wrapper,
.sudanads-form,
.form-group{

    direction:rtl !important;

    text-align:right !important;

}

.form-group label{

    text-align:right !important;

}

.form-group input,
.form-group textarea,
.form-group select{

    direction:rtl !important;

    text-align:right !important;

}

.form-group textarea{

    direction:rtl !important;

    text-align:right !important;

}

.form-group input::placeholder,
.form-group textarea::placeholder{

    direction:rtl;

    text-align:right;

}

.current-featured-image{

    margin-top:12px;

}

.current-featured-image img{

    width:180px;

    height:auto;

    border-radius:16px;

    border:1px solid #E5E7EB;

}

.current-gallery{

    display:flex;

    gap:10px;

    flex-wrap:wrap;

    margin-top:12px;

}

.gallery-thumb img{

    width:90px;

    height:90px;

    object-fit:cover;

    border-radius:12px;

    border:1px solid #E5E7EB;

}