html {
            scroll-behavior: smooth;
        }

        body {
            margin: 0;
            font-family: 'Droid Arabic Kufi', 'Segoe UI', sans-serif;
            background-color: #FFFFF0;
            color: black;
            overflow-x: hidden;
        }

        /* شريط العودة العلوي */
        .header-top {
            background: #FFFFF0;
            padding: 10px 20px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }

        .home-btn {
            color: blue !important;
            text-decoration: underline;
            font-size: 20px;
            padding: 8px 15px;
            border-radius: 5px;
            transition: 0.3s;
            display: inline-block;
        }

        .home-btn:hover {
            background: gray;
        }

        /* الهيدر الرئيسي */
        .header {
            background-color: #FFFFF0;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 10px 20px;
            position: relative;
            width: 100%;
            box-sizing: border-box;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }

        .header h1 {
            font-size: 24px;
			border-radius: 6px;
            margin: 0;
            box-sizing: content-box;
            text-align: center;
            color: rgb(14, 135, 190);
            padding: 0 0;
        }

        /* زر القائمة */
        .menu-toggle {
            cursor: pointer;
            width: 30px;
            height: 25px;
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            z-index: 1000;
            background: none;
            border: none;
            padding: 0;
        }

        .menu-toggle span {
            height: 3px;
            background: #005f5f;
            border-radius: 2px;
            transition: 0.3s;
        }

       .side-menu {
    position: fixed;
    top: 0;
    right: -300px; /* بدون !important */
    width: 250px;
    height: 50%;
    background-color: #007a7a;
    padding: 60px 20px 20px;
    box-shadow: -4px 0 12px rgba(0,0,0,0.2);
    transition: right 0.4s cubic-bezier(0.4,0,0.2,1);
    z-index: 1001;
}

.side-menu.active {
    right: 0;
}


        .side-menu a {
            display: block;
            color: white;
            text-decoration: none;
            margin: 15px 0;
            font-size: 18px;
            padding: 10px;
            border-radius: 5px;
            transition: background 0.3s;
        }

        .side-menu a:hover {
            background: #005f5f;
        }

        .close-btn {
            position: absolute;
            top: 15px;
            left: 15px;
            background: none;
            border: 2px solid white;
            color: white;
            padding: 5px 10px;
            cursor: pointer;
            font-size: 16px;
            border-radius: 5px;
        }

        /* قسم المنتجات */
        .products {
            background-color: #FFFFF0;
            padding: 0px 0px;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 25px;

            margin: 0 auto;
        }

        .product {
            background: #FFFFF0;
            padding: 5px;
            max-width: 80%;

            border-radius: 10px;

            text-align: center;
            box-shadow: 5px 10px 5px 5px rgba(0,0,0,0.4);
            transition: transform 0.3s;
            margin: 0 auto;


        }


        .product:hover {
            transform: translateY(-5px);
        }

        .product h3 {

          font-size: 20px;
          font-weight: bold;
            color: black;
            margin: 0 0 0px;
        }

        .product p {


            color: black;

            font-size: 18px;
            line-height: 1.6;
        }

        /* الفوتر */
        .footer {
        background-color: lightblue;
            padding: 10px 5px;
            text-align: center;
            color: #005f5f;
           /* margin-top: 15px;*/

        }



        /* التصميم المتجاوب */
        @media (max-width: 768px) {
            .header h1 {
                font-size: 20px;
                padding: 0 40px;
            }

            .menu-toggle {
                right: 15px;
                width: 25px;
            }

            .products {
                grid-template-columns: repeat(2,1fr);
                padding: 30px 15px;
            }


        }

        @media (max-width: 480px) {
            .header h1 {
                font-size: 18px;
            }

            .product {
                padding: 15px;
            }
        }

/* تنسيقات الأيقونات */
.icon {
    font-size: 20px;
}

.whatsapp .icon { color: #25D366; }
.email .icon { color: #ea4335; }

@media (max-width: 480px) {
    .contact-group {
        flex-wrap: wrap;
    }

    .additional-numbers {
        width: 100%;
        padding-right: 40px;
    }
}
.footer {
    text-align: center;
    padding: 40px 15px;
    background-color: #e0f7fa;
}

.footer h3 {
    color: #007a7a;
    font-size: 22px;
    margin-bottom: 10px;
}

.footer p, .footer a {
    font-size: 18px;
    color: #007a7a;
    transition: color 0.3s;
    text-decoration: none;
}

.footer a:active {
    transform: scale(0.98);
}

.footer a {
    display: inline-block;
    padding: 12px 25px;
    background: #25D366;
    border-radius: 30px;
    color: white;
    font-size: 16px;
    text-decoration: none;
    transition: background 0.3s, transform 0.2s;
}

.footer a:hover {
    background: #128C7E;
}

.footer .email-text {
    color: royalblue;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
}
.footer a:hover {
  transform: scale(1.05);
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}
.map-container{
width: 90%;
margin: 20px auto;
border: 1px dotted blue;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 10px rgba(180,0,0,0.2);
}

.whatsapp-float, .phone-float {
position: fixed;
bottom: 20px;
z-index: 9999;
}
.whatsapp-float { left: 20px; }
.phone-float { right: 20px; }
.whatsapp-float img, .phone-float img{
width: 90px;
height: 90px;
border-radius: 50%;
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
transition: transform 0.3s ease;
}
.whatsapp-float img:hover, .phone-float img:hover{
transform: scale(1.1);
}
.divider{
	margin-bottom: 15px;
}
#ourAddress{
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}
.copyrights {
	background-color: #111;
	color: #fff;
	text-align: center;
	padding: 15px 0;
	font-family: "Poppins", sans-serif;
	font-size: 18px;
	letter-spacing: 0.5px;
	border-top: 1px solid #333;
	margin-top: 0px;
}
.copyrights p {
	margin: 0;
}