/* ==================================================
   Tubgun Market
   Premium Advertisement UI
   ================================================== */


/* ================================
   Advertisement Card
================================ */

.ad-card {

    width:100%;
    max-width:380px;

    margin:18px auto;

    background:
    linear-gradient(
        145deg,
        rgba(255,255,255,.98),
        rgba(248,250,249,.95)
    );

    border-radius:24px;

    overflow:hidden;

    border:1px solid rgba(15,118,110,.15);

    box-shadow:
    0 12px 35px rgba(0,0,0,.12),
    0 2px 8px rgba(15,118,110,.08);

    display:flex;
    flex-direction:column;

    transition:
    transform .25s ease,
    box-shadow .25s ease;

}


.ad-card:hover {

    transform:translateY(-4px);

    box-shadow:
    0 18px 45px rgba(0,0,0,.18);

}



/* ================================
   Product Image
================================ */

.ad-image {

    width:100%;

    height:260px;

    object-fit:cover;

    display:block;

    cursor:pointer;

    transition:
    transform .35s ease;

}


.ad-card:hover .ad-image {

    transform:scale(1.03);

}



/* ================================
   Phone Section
================================ */

.ad-phone {

    padding:14px 18px;

    background:
    linear-gradient(
        90deg,
        #ecfdf5,
        #ffffff
    );

    border-bottom:

    1px solid rgba(15,118,110,.12);


    color:#065f46;

    font-size:16px;

    font-weight:700;

}



/* ================================
   Description
================================ */

.ad-description {

    padding:18px;

    color:#334155;

    font-size:15px;

    line-height:2;

    white-space:pre-wrap;

    min-height:90px;

}



/* ================================
   Premium Price Badge
================================ */

.ad-price {

    margin:10px 16px 18px !important;

    padding:15px !important;

    width:calc(100% - 32px) !important;

    box-sizing:border-box;


    background:

    linear-gradient(
        135deg,
        #fff7d6,
        #fffbeb
    ) !important;


    color:#92400e !important;


    border:

    1px solid rgba(180,83,9,.25);


    border-radius:18px !important;


    font-size:21px !important;

    font-weight:800 !important;

    text-align:center !important;


    box-shadow:

    inset 0 1px 3px rgba(255,255,255,.8);

}



/* ================================
   Meta Time
================================ */

.ad-card .meta {

    padding:

    0 18px 15px;

    color:#94a3b8;

    font-size:12px;

}



/* ==================================================
   Global Chat Isolation
================================================== */


.global-message.ad-card {

    width:100% !important;

    max-width:380px !important;

    min-height:0 !important;

    height:auto !important;


    padding:0 !important;

    margin:18px auto !important;


    background:#ffffff !important;

    color:#111 !important;


    display:flex !important;

    flex-direction:column !important;


    overflow:hidden !important;

    border-radius:24px !important;

    flex-shrink:0 !important;

}




.global-message.ad-card img.ad-image {

    width:100% !important;

    max-width:100% !important;

    height:260px !important;


    object-fit:cover !important;

    display:block !important;


    margin:0 !important;

    border-radius:0 !important;

}



.global-message.ad-card 
.ad-phone,
.global-message.ad-card 
.ad-description {

    display:block !important;

    width:100% !important;

    box-sizing:border-box !important;

}


/* Price has its own premium size */

.global-message.ad-card .ad-price {

    display:block !important;

    width:calc(100% - 32px) !important;

    margin-left:16px !important;

    margin-right:16px !important;

    box-sizing:border-box !important;

}



/* ==================================================
   Ad Create Window
================================================== */


#adModal {

    position:fixed;

    inset:0;

    display:none;

    background:

    rgba(0,0,0,.55);

    backdrop-filter:blur(8px);

    z-index:99999;

}



#adModal.show {

    display:flex;

    justify-content:center;

    align-items:center;

}



.ad-window {


    width:92%;

    max-width:420px;


    padding:22px;


    background:

    rgba(255,255,255,.95);


    border-radius:26px;


    box-shadow:

    0 25px 70px rgba(0,0,0,.25);


    display:flex;

    flex-direction:column;

    gap:15px;

}



/* Header */


.ad-header {

    display:flex;

    justify-content:space-between;

    align-items:center;


    color:#065f46;

    font-size:21px;

    font-weight:800;

}



#closeAdWindow {

    cursor:pointer;

    font-size:26px;

}



/* Inputs */


.ad-window input,
.ad-window textarea {


    width:100%;


    padding:14px;


    border-radius:14px;


    border:

    1px solid rgba(15,118,110,.2);


    font-size:15px;


    background:#f8fafc;


    outline:none;


    transition:.2s;

}



.ad-window input:focus,
.ad-window textarea:focus {


    border-color:#0f766e;


    background:#ffffff;

}



#adDescription {

    min-height:140px;

    resize:none;

}



/* Publish Button */


#publishAd {


    padding:15px;


    border:none;


    border-radius:16px;


    background:

    linear-gradient(
        135deg,
        #047857,
        #0f766e
    );


    color:white;


    font-size:17px;

    font-weight:700;


    cursor:pointer;


    box-shadow:

    0 8px 20px rgba(15,118,110,.3);


    transition:.25s;

}



#publishAd:hover {


    transform:translateY(-2px);


}



/* ==================================================
   Mobile Optimization
================================================== */


@media(max-width:768px){


.ad-card,
.global-message.ad-card {


    max-width:100% !important;

    border-radius:22px !important;


}



.ad-image,
.global-message.ad-card img.ad-image {


    height:240px !important;


}



.ad-price {


    font-size:20px !important;


}


}

/* ==================================================
   Tubgun Market
   Premium Ad Creator Widget
================================================== */


/* Modal Background */

#adModal {

    background:
    rgba(2,6,23,.55) !important;

    backdrop-filter:
    blur(10px);

}



/* Creator Window */

.ad-window {

    width:92% !important;

    max-width:430px !important;


    padding:24px !important;


    background:

    linear-gradient(
        145deg,
        rgba(255,255,255,.98),
        rgba(248,250,252,.95)
    ) !important;


    border-radius:28px !important;


    border:

    1px solid rgba(15,118,110,.15);


    box-shadow:

    0 30px 80px rgba(0,0,0,.30);


    animation:

    tubgunPopup .25s ease;

}



/* Open Animation */

@keyframes tubgunPopup {

    from {

        opacity:0;

        transform:
        translateY(30px)
        scale(.96);

    }


    to {

        opacity:1;

        transform:
        translateY(0)
        scale(1);

    }

}



/* Header */

.ad-header {


    padding-bottom:12px;


    border-bottom:

    1px solid rgba(15,118,110,.12);


    color:#065f46 !important;


    font-size:22px !important;


    font-weight:800 !important;

}



/* Close Button */

#closeAdWindow {


    width:36px;

    height:36px;


    display:flex;

    align-items:center;

    justify-content:center;


    border-radius:50%;


    background:#f1f5f9;


    color:#334155;


    transition:.25s;

}



#closeAdWindow:hover {


    background:#fee2e2;

    color:#dc2626;

}



/* Inputs Container */

.ad-window input,
.ad-window textarea {


    background:

    rgba(248,250,252,.9) !important;


    border:

    1px solid rgba(15,118,110,.18) !important;


    border-radius:16px !important;


    padding:15px !important;


    color:#0f172a;


    font-size:15px !important;


    transition:.25s;


}



/* Focus */

.ad-window input:focus,
.ad-window textarea:focus {


    background:white !important;


    border-color:#0f766e !important;


    box-shadow:

    0 0 0 4px rgba(15,118,110,.12);


}



/* Description */

#adDescription {


    min-height:150px !important;


    line-height:1.9;


}



/* Image Upload Area */

#adImage,
#adImageUpload {


    cursor:pointer;


}



/*
 اگر input تصویر مخفی باشد
*/

.ad-window input[type="file"] {


    padding:12px;


    background:

    linear-gradient(
        135deg,
        #ecfdf5,
        #ffffff
    );


    border:

    2px dashed rgba(15,118,110,.35) !important;


}



/* Price Field */

#adPrice {


    background:

    linear-gradient(
        135deg,
        #fffbeb,
        #fff7d6
    ) !important;


    border-color:

    rgba(180,83,9,.25) !important;


    font-weight:700;


    color:#92400e;

}



/* Publish Button */

#publishAd {


    margin-top:8px;


    height:55px;


    border-radius:18px !important;


    background:

    linear-gradient(
        135deg,
        #059669,
        #047857
    ) !important;


    font-size:18px !important;


    font-weight:800 !important;


    letter-spacing:.2px;


    box-shadow:

    0 12px 25px rgba(5,150,105,.35);


    transition:.25s;

}



#publishAd:hover {


    transform:

    translateY(-3px);


    box-shadow:

    0 18px 35px rgba(5,150,105,.45);


}



/* Bottom Trust Text */

.ad-window::after {


    content:

    "✓ انتشار در چت جهانی تابگان   ✓ تماس مستقیم خریدار";


    display:block;


    margin-top:8px;


    text-align:center;


    color:#64748b;


    font-size:12px;

}



/* Mobile */

@media(max-width:768px){


.ad-window {


    width:94% !important;


    padding:20px !important;


    border-radius:24px !important;


}



.ad-header {

    font-size:20px !important;

}


#publishAd {


    height:52px;

}

}

/* ==========================================
   Tubgun Premium Form Alignment Fix
========================================== */


/* Center all form elements */

.ad-window {

    width:100% !important;

    box-sizing:border-box !important;

    align-items:center !important;

}



/* Fix inputs overflow */

.ad-window input,
.ad-window textarea,
.ad-window button {


    width:100% !important;

    max-width:100% !important;

    box-sizing:border-box !important;

    margin-left:auto !important;

    margin-right:auto !important;

}



/* Keep inside padding */

.ad-window input,
.ad-window textarea {


    display:block !important;

}



/* Prevent global chat styles */

#adModal .ad-window * {


    box-sizing:border-box !important;

}



/* Mobile extra safety */

@media(max-width:768px){


.ad-window {

    width:94% !important;

    margin:auto !important;

}


.ad-window input,
.ad-window textarea,
.ad-window button {

    width:100% !important;

}

}

/* ==========================================
   Tubgun Logo - Blue Glass Clean
========================================== */

.ad-brand {

    display:flex;

    justify-content:center;

    align-items:center;

    padding:12px 0 8px;

}


.tubgun-logo-glass {

    width:52px;

    height:52px;

    object-fit:contain;


    padding:0;

    background:none;

    border:none;


    /* فقط تغییر رنگ خود لوگو */

    filter:
    brightness(0)
    saturate(100%)
    invert(40%)
    sepia(90%)
    saturate(1600%)
    hue-rotate(175deg)
    brightness(95%)
    contrast(110%);


}

/* ==========================================
   Tubgun Disclaimer
========================================== */

.ad-brand{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:6px;

    padding:10px 12px 6px;

}

.ad-disclaimer{

    font-size:10px;

    line-height:1.7;

    color:#3b82f6;

    text-align:center;

    font-weight:500;

    opacity:.9;

    max-width:90%;

}