.elementor-29198 .elementor-element.elementor-element-82f6e02{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-29198 .elementor-element.elementor-element-0aaf648{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for wooecom_instant_order, class: .elementor-element-29840f3 */.elementor-29198 .elementor-element.elementor-element-29840f3 {
direction: rtl;
padding: 26px 18px;
border-radius: 28px;

background:
radial-gradient(circle at top right, rgba(122, 59, 120, 0.16), transparent 36%),
radial-gradient(circle at bottom left, rgba(179, 176, 182, 0.20), transparent 40%),
linear-gradient(180deg, #fbf9fb 0%, #f4eff5 48%, #ffffff 100%);

border: 1.5px solid rgba(101, 56, 98, 0.28);

box-shadow:
0 18px 45px rgba(62, 32, 61, 0.15),
inset 0 0 30px rgba(255, 255, 255, 0.85);

overflow: hidden;
position: relative;
}


/* زخرفة خلفية خفيفة */
.elementor-29198 .elementor-element.elementor-element-29840f3::before {
content: "";
position: absolute;
inset: 0;

background:
linear-gradient(
135deg,
rgba(101, 56, 98, 0.045) 25%,
transparent 25%
) -18px 0/38px 38px,

linear-gradient(
225deg,
rgba(179, 176, 182, 0.055) 25%,
transparent 25%
) -18px 0/38px 38px;

opacity: 0.65;
pointer-events: none;
}


/* الشارة العلوية */
.elementor-29198 .elementor-element.elementor-element-29840f3::after {
content: "COAL TAR 20%";

position: absolute;

top: 14px;
left: 18px;

background: #ffffff;

color: #653862;

border: 1px solid rgba(101, 56, 98, 0.35);

border-radius: 999px;

padding: 6px 16px;

font-size: 12px;
font-weight: 900;

letter-spacing: 0.8px;

box-shadow:
0 7px 18px rgba(62, 32, 61, 0.12);

pointer-events: none;
}


/* الفورم */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-form {
position: relative;
z-index: 2;
}


/* عناوين الحقول */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field-label {
color: #3e203d !important;

font-weight: 900;

font-size: 15px;

margin-bottom: 7px;
}


/* الحقول */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field,
.elementor-29198 .elementor-element.elementor-element-29840f3 input,
.elementor-29198 .elementor-element.elementor-element-29840f3 textarea,
.elementor-29198 .elementor-element.elementor-element-29840f3 select {

background:
rgba(255, 255, 255, 0.98) !important;

color: #342433 !important;

border:
1.5px solid rgba(101, 56, 98, 0.26) !important;

border-radius:
16px !important;

min-height: 52px;

padding:
13px 15px !important;

font-size: 16px;

font-weight: 700;

box-shadow:
inset 0 2px 8px rgba(62, 32, 61, 0.04),
0 8px 20px rgba(62, 32, 61, 0.07);

transition:
all 0.25s ease;
}


/* حقل الملاحظات */
.elementor-29198 .elementor-element.elementor-element-29840f3 textarea {
min-height: 98px;

resize: vertical;
}


/* عند الضغط على الحقل */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field:focus,
.elementor-29198 .elementor-element.elementor-element-29840f3 input:focus,
.elementor-29198 .elementor-element.elementor-element-29840f3 textarea:focus,
.elementor-29198 .elementor-element.elementor-element-29840f3 select:focus {

outline: none !important;

border-color:
#7a3b78 !important;

background:
#ffffff !important;

box-shadow:
0 0 0 4px rgba(122, 59, 120, 0.12),
0 10px 25px rgba(62, 32, 61, 0.13);
}


/* النص داخل الحقول */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field::placeholder,
.elementor-29198 .elementor-element.elementor-element-29840f3 input::placeholder,
.elementor-29198 .elementor-element.elementor-element-29840f3 textarea::placeholder {

color:
rgba(62, 32, 61, 0.42) !important;

font-weight: 600;
}


.elementor-29198 .elementor-element.elementor-element-29840f3 select {
appearance: auto;
cursor: pointer;
}


/* =========================
   زر الطلب
========================= */

.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-button {

width: 100%;

min-height: 58px;

border-radius:
999px !important;

background:
linear-gradient(
135deg,
#7a3b78 0%,
#653862 48%,
#3e203d 100%
) !important;

color:
#ffffff !important;

border:
2px solid rgba(230, 227, 232, 0.85) !important;

font-size:
20px !important;

font-weight:
1000 !important;

letter-spacing: 0;

box-shadow:
0 14px 30px rgba(62, 32, 61, 0.28),
0 0 20px rgba(122, 59, 120, 0.15);

transition:
all 0.25s ease;
}


/* hover */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-button:hover {

transform:
translateY(-2px);

filter:
brightness(1.08);

box-shadow:
0 18px 38px rgba(62, 32, 61, 0.34),
0 0 27px rgba(122, 59, 120, 0.22);
}


/* عند الضغط */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-button:active {
transform:
translateY(0);
}


.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-button-text {

color:
#ffffff !important;

text-shadow:
0 1px 2px rgba(0,0,0,0.20);
}


/* =========================
   رسائل الفورم
========================= */

.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-message {

color:
#3e203d !important;

font-weight:
900;

text-align:
center;

background:
rgba(255, 255, 255, 0.92);

border:
1px solid rgba(101, 56, 98, 0.22);

border-radius:
14px;

padding:
11px;

box-shadow:
0 7px 18px rgba(62, 32, 61, 0.07);
}


/* نجاح الطلب */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-message-success {

color:
#267144 !important;

border-color:
rgba(38, 113, 68, 0.25);
}


/* خطأ */
.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-message-danger {

color:
#a42d43 !important;

border-color:
rgba(164, 45, 67, 0.25);
}


/* =========================
   MOBILE
========================= */

@media (max-width: 767px) {

.elementor-29198 .elementor-element.elementor-element-29840f3 {

padding:
22px 13px;

border-radius:
22px;

}


.elementor-29198 .elementor-element.elementor-element-29840f3::after {

top:
10px;

left:
12px;

font-size:
10px;

padding:
5px 12px;

letter-spacing:
0.5px;

}


.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field-label {

font-size:
14px;

}


.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-field,
.elementor-29198 .elementor-element.elementor-element-29840f3 input,
.elementor-29198 .elementor-element.elementor-element-29840f3 textarea,
.elementor-29198 .elementor-element.elementor-element-29840f3 select {

min-height:
49px;

font-size:
15px;

border-radius:
14px !important;

}


.elementor-29198 .elementor-element.elementor-element-29840f3 .elementor-button {

min-height:
55px;

font-size:
18px !important;

border-radius:
999px !important;

}

}/* End custom CSS */