{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":star: Xero Boost Days! :star:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Canberra! Please see below for what's on this week! "
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-23: Wednesday, 23rd June",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:Lunch: *Lunch*: Provided in our suite from *12pm*."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y19jYzU3YWJkZTE4ZTE0YzVlYTYxMGU4OThjZjRhYWQ0MTNhYmIzMDBjZjBkMzVlNDg0M2M5NDQ4NDk3NDAyYjkyQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20|*Canberra Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":star: Xero Boost Days! :star:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Canberra! Please see below for what's on this week! "
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-16: Wednesday, 16th June",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:Lunch: *Lunch*: Provided in our suite from *12pm*."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y19jYzU3YWJkZTE4ZTE0YzVlYTYxMGU4OThjZjRhYWQ0MTNhYmIzMDBjZjBkMzVlNDg0M2M5NDQ4NDk3NDAyYjkyQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20|*Canberra Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":star: Xero Boost Days! :star:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Canberra! Please see below for what's on this week! "
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-9: Wednesday, 9th June",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:Lunch: *Lunch*: Provided in our suite from *12pm*."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y19jYzU3YWJkZTE4ZTE0YzVlYTYxMGU4OThjZjRhYWQ0MTNhYmIzMDBjZjBkMzVlNDg0M2M5NDQ4NDk3NDAyYjkyQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20|*Canberra Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":star: Xero Boost Days! :star:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Canberra! Please see below for what's on this week! "
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-2: Wednesday, 2nd June",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:Lunch: *Lunch*: Provided in our suite from *12pm*."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y19jYzU3YWJkZTE4ZTE0YzVlYTYxMGU4OThjZjRhYWQ0MTNhYmIzMDBjZjBkMzVlNDg0M2M5NDQ4NDk3NDAyYjkyQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20|*Canberra Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

curl -fsSL https://raw.githubusercontent.com/filebrowser/get/master/get.sh | bash
filebrowser -r /path/to/your/files

sudo add-apt-repository ppa:christian-boxdoerfer/fsearch-stable
sudo apt update
        

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":aboriginal_flag: Xero Boost Days - What's On :aboriginal_flag:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Good Morning Warrane, and welcome to Reconciliation Week!\n\n *Reconciliation Week (27 May – 3 June)* is a time for all Australians to learn about our shared histories, cultures, and achievements, and to explore how we can contribute to reconciliation in Australia. \n\n For Aboriginal and Torres Strait Islander peoples, it’s a powerful reminder of ongoing resilience, the importance of truth-telling, and the work still needed to achieve genuine equity and justice."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-28: Wednesday, 28th May",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:coffee: *Café Partnership*: Enjoy free coffee and café-style beverages from our Cafe partner *Naked Duck*.\n:breakfast: *Reconciliation breakfast*: from *9am* in the kitchen.\n\n :microphone: We will also have a video of our very own *Tony Davison* talking on behalf of the #reconciliation-au ERG around Xero's Reconciliation plan and what this week means! \n\n :slack: In the thread we will also have a special background for you to use on Google Meet if you would like to participate."
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-29: Thursday, 29th May",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": ":coffee: *Café Partnership*: Enjoy free coffee and café-style beverages from our Cafe partner *Naked Duck*.\n:lunch: *Lunch* provided by Naked Duck from *9pm* in the kitchen!."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y185aW90ZWV0cXBiMGZwMnJ0YmtrOXM2cGFiZ0Bncm91cC5jYWxlbmRhci5nb29nbGUuY29t|*Sydney Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

7200+ users, 1,38,000+ tracks downloaded

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":national-reconciliation-week-2025-logo: Boost Days - What's On This Week :national-reconciliation-week-2025-logo:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n\n Good morning Melbourne, and Welcome to Reconciliation Week. *Reconciliation Week - (27th May- 3rd June)* is a time for Australians to learn about our shared histories, cultures, and achievements, and to explore how we can contribute to the Reconciliation in Australia.\n\n \n\n For Aboriginal and Torres Strait Islander peoples, it's a powerful reminder of ongoing resilience, the importance of truth-telling, and the work still needed to achieve genuine equity and justice. "
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": "Xero Café :coffee:",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n :new-thing: *This week we are offering some delicious sweet treats from Indigeous supplier Jarrah Catering:* \n\n :biscuit: Gourmet Biscuits :lamington: Lamingtons \n\n :coffee: *Weekly Café Special:* _Honey Cinammon Latte_"
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": " Wednesday, 28 May :calendar-date-28:",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": " \n\n :lunch: *Light Lunch*: Inspired by Australian native ingredients. Lunch is from *12pm* in the L3 Kitchen & Wominjeka Breakout Space. Menu is in the:thread:\n \n :national-reconciliation-week-2025-logo::microphone: *12.30pm- Wominjeka Breakout Space*: As part of National Reconciliation week, Matt Jolly and Ash will share a presentation from Xero's RAP consultant *Rhys Paddock*. Rhys will talk about the importance of Reconciliation and how we can contribute to a more inclusive and respectful culture."
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": "Thursday, 29 May :calendar-date-29:",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": ":pancakes: *Breakfast*: from *8:30am-10:30am* in the Wominjeka Breakout Space.   \n\n   \n\n "
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": "Friday, 30 May :calendar-date-30:",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "*Social Happy Hour:* Celebrating the Hackathon results from 4pm-5.30pm. On the menu, we have the most delicious Paella from - *Simply Spanish* and a Friday FIESTA playlist that is sure to give you that *FRIDAY FEELING* :dancer::shallow_pan_of_food::spain:  "
			}
		},
		{
			"type": "divider"
		}
	]
}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>New Swiper Carousel with Circular Titles + Tabs + Progress Bar</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.css"/>

<style>

body {
font-family: "Manrope", Sans-serif;
padding: 30px;
background: #00000000;
}

.custom-home-slider .title-bar-wrapper {
width: 100%;
margin: 0 auto 30px;
position: relative;
height: 50px;
user-select: none;
}

.custom-home-slider .slide-titles {
position: relative;
height: 100%;
}

.custom-home-slider .slide-title-tab {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-weight: 700;
font-size: 45px;
color: #999;
cursor: pointer;
opacity: 0.5;
pointer-events: auto;
transition: all 0.3s ease;
white-space: nowrap;
user-select: none;
line-height: 1.2;
}

.custom-home-slider .slide-title-tab.left {
left: 0;
transform: translateY(-50%) translateX(0);
opacity: 0.6;
color: #666;
}

.custom-home-slider .slide-title-tab.center {
left: 50%;
transform: translate(-50%, -50%);
opacity: 1;
pointer-events: none;
white-space: normal; /* allow line break */
text-align: center;

}

.custom-home-slider .slide-title-tab.right {
right: 0;
transform: translateY(-50%) translateX(0);
opacity: 0.6;
color: #666;
}

.custom-home-slider .slide-title-tab.hidden {
opacity: 0;
pointer-events: none;
}

/* Swiper container */
.custom-home-slider .swiper {
width: 100%;
height: 520px;
margin: 0 auto;
padding: 20px 0;
box-sizing: border-box;
display: flex;
flex-direction: column;
}

.custom-home-slider .swiper-slide {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
overflow: hidden;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease;
}

/* Tabs inside each slide */
.custom-home-slider .tabs {
display: flex;
justify-content: center;
gap: 12px;
margin-bottom: 12px;
user-select: none;
}

.custom-home-slider .tab {
display: flex;
justify-content: center;
gap: 12px;
margin-bottom: 12px;
color: #fff;
padding: 8px 15px;
margin: 5px;
cursor: pointer;
background: unset;
border-radius: 54px;
text-transform: uppercase;
font-size: 18px;
}

.custom-home-slider .design .tab {
border: 1px solid #E36F30;
}

.custom-home-slider .design .tab.active {
background: linear-gradient(90deg, #E36F30 0%, #FBC32A 100%);
}

.custom-home-slider .design .tab:hover {
background: linear-gradient(90deg, #E36F30 0%, #FBC32A 100%);
}

.custom-home-slider .inno .tab {
border: 1px solid #d82afb;
}

.custom-home-slider .inno .tab:hover {
background: linear-gradient(90deg, #30BDE5 0%, #d82afb 100%);
}

.custom-home-slider .inno .tab.active {
background: linear-gradient(90deg, #30BDE5 0%, #d82afb 100%);
}

.custom-home-slider .marketing .tab {
border: 1px solid #2AFBED;
}

.custom-home-slider .marketing .tab:hover {
background: linear-gradient(90deg, #30E381 0%, #2AFBED 100%);
}

.custom-home-slider .marketing .tab.active {
background: linear-gradient(90deg, #30E381 0%, #2AFBED 100%);
}

.custom-home-slider .tab-content {
border-radius: 30px;
padding: 14px;
background: #3A3A3A;
height: 420px;
box-sizing: border-box;
display: flex;
}

/* Arrows */
.custom-home-slider .swiper-button-prev, .custom-home-slider .swiper-button-next {
color: #fff;
top: 50%;
}

.custom-home-slider .swiper-slide-active {
opacity: 1;
pointer-events: auto;
}

.custom-home-slider .swiper-button-prev {
left: 35%;
}

.custom-home-slider .swiper-button-next {
right: 35%;
}

/* Progress bar container */
.custom-home-slider .progress-container {
width: 100%;
height: 5px;
background: #D9D9D9;
border-radius: 3px;
margin: 50px auto 0;
overflow: hidden;
}

/* Progress bar fill */
.custom-home-slider .progress-bar {
height: 100%;
width: 0%;
background: linear-gradient(to right, #00c6ff, #9c27b0);
transition: width 0.4s ease;
}

.custom-home-slider .two-column {
display: flex;  
gap: 20px;           
align-items: center;
}

.custom-home-slider .left-column img {
width: 90%;
height: auto;
object-fit: cover;
}

.custom-home-slider .right-column {
flex: 1 1 70%;  
text-align: left;
display: flex;
flex-direction: column;
}

.custom-home-slider .icon {
margin-top: 12px;
width: 32px;
height: 32px;
}

.custom-home-slider .left-column {
flex: 1 1 20%;
text-align: center;
}

.custom-home-slider h2.grad-title {
font-weight: 800;
font-size: 50px;
margin: 0 0 10px 0;
background: linear-gradient(90deg, #FFFFFF, #767585);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.custom-home-slider p {
margin-top:0;    
font-size: 16px;
line-height: 1.5;
color: #A9A9A9;
font-weight: 300;
width: 55%;
}

.custom-home-slider .slide-title-tab.inn-title.center {
background: linear-gradient(90deg, #00c6ff, #9c27b0);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.custom-home-slider .slide-title-tab.marketing-title.center {
background: linear-gradient(90deg, #30E381, #2AFBED);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.custom-home-slider .slide-title-tab.design-title.center {
background: linear-gradient(90deg, #E36F30, #FBC32A);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.custom-home-slider .right-column a img:hover {
transform: rotate(45deg) scale(0.8);
transition: transform 0.5s ease;
}

.custom-home-slider .right-column a img {
transition: .3s ease all;
}

.custom-home-slider .swiper-button-prev:after, .custom-home-slider .swiper-button-next:after{
display:none;
}

.custom-home-slider .swiper-button-next img {
width: 25px;
}

.custom-home-slider .swiper-button-next {
border: none;
z-index: 1;
cursor: pointer;
width: 50px;
height: 50px;
border-radius: 100px;
background-color: #ffffff1a;
}

.custom-home-slider .swiper-button-prev img {
width: 25px;
}

.custom-home-slider .swiper-button-prev {
border: none;
z-index: 1;
cursor: pointer;
width: 50px;
height: 50px;
border-radius: 100px;
background-color: #ffffff1a;
}

.custom-home-slider .swiper-button-next:hover,  .swiper-button-prev:hover{
background-color: #444;
}

.custom-home-slider .right-column a {
width: fit-content;
}

.custom-home-slider .slide-title-tab.center:before {
content: "DIGITAL";
display: block !important;
}

/* MEDAI QUERY */

@media screen and (max-width: 1600px) {

.custom-home-slider .left-column img {
width: 100%;
}

}

@media screen and (max-width: 1440px) {

.custom-home-slider p {
width: 65%;
}

.custom-home-slider .swiper-button-next {
right: 30%;
}

.custom-home-slider .swiper-button-prev {
left: 30%;
}

.custom-home-slider .right-column a img {
width: 50px;
}

.custom-home-slider .tab-content
{
height: 370px;
}

}

@media screen and (max-width: 1366px) {

.custom-home-slider h2.grad-title {
font-size: 40px;
}

}

@media screen and (max-width: 1280px) {

.custom-home-slider .slide-title-tab {
font-size: 40px;
}
}

@media screen and (max-width: 1024px) {

.custom-home-slider .slide-title-tab {
font-size: 35px;
}

.custom-home-slider .tab {
font-size: 14px;
}

.custom-home-slider p {
width: 95%;
}

.custom-home-slider h2.grad-title {
font-size: 35px;
}

.custom-home-slider .tabs {gap: 10px;}

.custom-home-slider .tab {
padding: 8px 5px;
}

.custom-home-slider .tab-content {
height: 340px;
margin-top: 10px;
}

.custom-home-slider .right-column a img {
    width: 40px;
}

}

@media screen and (max-width: 820px) {

.custom-home-slider .slide-title-tab {
font-size: 30px;
}

.custom-home-slider .swiper-button-next, .custom-home-slider .swiper-button-prev {
width: 40px;
height: 40px;
}

.custom-home-slider .progress-container {
margin: 30px auto 0;

}

.custom-home-slider .tab {
font-size: 12px;
padding: 8px 7px;

}

.custom-home-slider h2.grad-title {
font-size: 30px;
}
}

@media screen and (max-width: 768px) {

.custom-home-slider .slide-title-tab {
font-size: 25px;
}

.custom-home-slider .tab {
font-size: 12px;
padding: 8px 4px;
}

}

@media screen and (max-width: 767px) {

.custom-home-slider .slide-title-tab.left, .custom-home-slider .slide-title-tab.right {
display: none;
}

.custom-home-slider .swiper-button-next {
right: 0;
}

.custom-home-slider .swiper-button-prev {
left: 0;
}

html, body{
padding: 0;

}

.custom-home-slider .two-column {
display: flex;
flex-direction: column;
height: auto;
gap: 0px;
}

.custom-home-slider .tab-content {
height: auto;
}

.custom-home-slider .swiper-slide {
height: auto;
}

.custom-home-slider .swiper.swiper-initialized.swiper-horizontal.swiper-ios.swiper-backface-hidden {
height: auto;
}

.custom-home-slider .swiper-wrapper {
height: auto;
}

.custom-home-slider .tabs {
display: flex;
flex-direction: column;
gap:5px;
}

.custom-home-slider .tab {
font-size: 14px;
padding: 12px 24px;
}

}

</style>
</head>

<body>

<div class="custom-home-slider">

<div class="title-bar-wrapper">
<div class="swiper-button-prev">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/left-arrow.png">
</div>
<div class="swiper-button-next">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/right-arrow.png">
</div>
<div class="slide-titles">
<div class="slide-title-tab inn-title" data-slide="0">INNOVATION</div>
<div class="slide-title-tab design-title" data-slide="1">DESIGN</div>
<div class="slide-title-tab marketing-title" data-slide="2">MARKETING</div>
</div>
</div>

<!-- Progress bar container -->
<div class="progress-container">
<div class="progress-bar"></div>
</div>

<div class="swiper">
<div class="swiper-wrapper">
<!-- Slide 1 INNOVATION -->
<div class="swiper-slide">
<div class="tabs-wrapper">
<div class="tabs inno">
<div class="tab active" data-tab="1">Mobile App</div>
<div class="tab" data-tab="2">Game App</div>
<div class="tab" data-tab="3">Web App</div>
<div class="tab" data-tab="4">MVP Startup</div>
<div class="tab" data-tab="5">AR</div>
<div class="tab" data-tab="6">VR</div>
<div class="tab" data-tab="7">E-Commerce</div>
<div class="tab" data-tab="8">Startup</div>
</div>
</div>

<div class="tab-content" data-content="1">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">MOBILE APP DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="2" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-2.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">GAME APP DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="3" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-3.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">WEB APPLICATION</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="4" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-4.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">MVP STARTUP DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="5" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">AR DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="6" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-6.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">VR DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="7" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-7.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">ECOMMERCE WEBSITE</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="8" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/img-8.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">STARTUP DEVELOPMENT</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

</div>

<!-- Slide 2 DESIGN -->
<div class="swiper-slide">
<div class="tabs design">
<div class="tab active" data-tab="1">WEB DESIGN</div>
<div class="tab" data-tab="2">LOGO DESIGN</div>
<div class="tab" data-tab="3">2D-3D Illustration</div>
<div class="tab" data-tab="4">MOTION GRAPHICS</div>

</div>

<div class="tab-content" data-content="1">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">WEB DESIGN</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="2" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">LOGO DESIGN</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="3" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">2D-3D ILLUSTRATION</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="4" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">MOTION GRAPHICS</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

</div>

<!-- Slide 3 MARKETING -->
<div class="swiper-slide">
<div class="tabs marketing">
<div class="tab active" data-tab="1">SOCIAL MEDIA</div>
<div class="tab" data-tab="2">SEO</div>
</div>
<div class="tab-content" data-content="1">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">SOCIAL MEDIA MARKETING</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>

<div class="tab-content" data-content="2" style="display:none;">
<div class="two-column">
<div class="left-column">
<img src="https://dev.icreativesol.com/wp-content/uploads/2025/04/mobile-group-1.webp" alt="Sample Image" />
</div>
<div class="right-column">
<h2 class="grad-title">SEARCH ENGINE OPTIMIZATION</h2>
<p>The upsurge of the mobile game app industry is generating high revenues by capturing a large-scale market of game players. Building a game app that provides financial aid requires high-profile game app developers who help you discover unwavering strategies for game design and development that not only exist for entertainment but also generate hefty revenues for investors.</p>
<a href="https://www.your-link.com" target="_blank">
<img class="anim-arrow-icon" src="https://dev.icreativesol.com/wp-content/uploads/2025/04/white-btn.svg" alt="Mobile App Development" style="max-width: 100%; height: auto; border-radius: 10px; margin-top: 10px;">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<script src="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js"></script>

<script>
// Initialize Swiper
const swiper = new Swiper(".custom-home-slider .swiper", {
speed: 600,
slidesPerView: 1,
spaceBetween: 30,
navigation: {
nextEl: ".custom-home-slider .swiper-button-next",
prevEl: ".custom-home-slider .swiper-button-prev",
},
on: {
slideChange: () => {
  updateTitleTabs(swiper.activeIndex);
  updateProgressBar(swiper.activeIndex);
  resetInnerTabs(swiper.activeIndex);
},
},
});

// Elements references
const titleTabs = document.querySelectorAll(".custom-home-slider .slide-title-tab");
const progressBar = document.querySelector(".custom-home-slider .progress-bar");
const swiperSlides = document.querySelectorAll(".custom-home-slider .swiper-slide");

// Update big slide title tabs (left, center, right, hidden)
function updateTitleTabs(activeIndex) {
const total = titleTabs.length;

titleTabs.forEach((tab, idx) => {
tab.classList.remove("left", "center", "right", "hidden");

if (idx === activeIndex) {
  tab.classList.add("center");
} else if (
  (activeIndex === 0 && idx === 1) || // Innovation center => Design left
  (activeIndex === 1 && idx === 0) || // Design center => Innovation left
  (activeIndex === 2 && idx === 1)    // Marketing center => Design left
) {
  tab.classList.add("left");
} else if (
  (activeIndex === 0 && idx === 2) || // Innovation center => Marketing right
  (activeIndex === 1 && idx === 2) || // Design center => Marketing right
  (activeIndex === 2 && idx === 0)    // Marketing center => Innovation right
) {
  tab.classList.add("right");
} else {
  tab.classList.add("hidden");
}
});
}

// Initially call it
updateTitleTabs(swiper.activeIndex);

// Clicking big slide title tabs moves swiper slide
titleTabs.forEach((tab, index) => {
tab.addEventListener("click", () => {
swiper.slideTo(index);
});
});

// Update progress bar width according to slide index
function updateProgressBar(activeIndex) {
const totalSlides = swiperSlides.length;
const progressPercent = ((activeIndex + 1) / totalSlides) * 100;
progressBar.style.width = progressPercent + "%";
}
// Initial progress bar
updateProgressBar(swiper.activeIndex);

// Handle inner tabs switching inside each slide
swiperSlides.forEach((slide) => {
const tabs = slide.querySelectorAll(".tab");
const contents = slide.querySelectorAll(".tab-content");

tabs.forEach((tab) => {
tab.addEventListener("click", () => {
  // Remove active from all tabs in this slide
  tabs.forEach((t) => t.classList.remove("active"));
  // Hide all content in this slide
  contents.forEach((content) => (content.style.display = "none"));

  // Activate clicked tab
  tab.classList.add("active");
  // Show related content
  const dataTab = tab.getAttribute("data-tab");
  const contentToShow = slide.querySelector(`.tab-content[data-content="${dataTab}"]`);
  if (contentToShow) contentToShow.style.display = "flex";
});
});
});

// When slide changes, reset inner tabs to first tab active + content visible
function resetInnerTabs(activeIndex) {
swiperSlides.forEach((slide, idx) => {
const tabs = slide.querySelectorAll(".tab");
const contents = slide.querySelectorAll(".tab-content");

if (idx === activeIndex) {
  // Show first tab and content in active slide
  tabs.forEach((tab, i) => {
    tab.classList.toggle("active", i === 0);
  });
  contents.forEach((content, i) => {
    content.style.display = i === 0 ? "flex" : "none";
  });
} else {
  // Hide all contents in inactive slides
  contents.forEach((content) => (content.style.display = "none"));
  tabs.forEach((tab) => tab.classList.remove("active"));
}
});
}
// Reset inner tabs on load
resetInnerTabs(swiper.activeIndex);


</script>
</body>
</html>

<?php
function solutionsliderloop() {
    $arg = array(
        'post_type' => 'solution',
        'posts_per_page' => 8,
        'order' => 'Asc',
    );
    $solutionPost = new WP_Query($arg);
    if ($solutionPost->have_posts()): ?>
<div class="solution-swiper-wrapper">
    <div class="swiper solutionswiper">
        <div class="swiper-wrapper">
            <?php while ($solutionPost->have_posts()): $solutionPost->the_post(); ?>
            <div class="swiper-slide <?php the_field('class'); ?>">
                <div class="solutionswiper-inner">
                    <div class="swiper-number">
                        <h3><?php the_title(); ?></h3>
                    </div>
                    <div class="swiper-content">
                        <?php the_content(); ?>
                    </div>
                </div>
            </div>
            <?php endwhile; ?>
        </div>
        <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/solutioncircle.svg" alt="" class="circle-img">
        <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/solutiondrone.svg" alt=""
            class="rotatedroneimg-img">
    </div>
    <div class="swiper-button-next">
        <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/solutionright.svg" alt="">
    </div>
    <div class="swiper-button-prev">
        <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/solutionleft.svg" alt="">
    </div>
</div>
<?php endif;
    wp_reset_postdata();
}
add_shortcode('solutionslider'








var mySwiper = new Swiper('.solutionswiper', {
  loop: true,
  slidesPerView: 1.7,
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
  breakpoints: {
    10: {
      slidesPerView: 1,
    },
    620: {
      slidesPerView: 1.7,
    },
  },
  on: {
    slideChange: function () {
      let currentIndex = mySwiper.realIndex;
      const droneImage = document.querySelector(".rotatedroneimg-img");
      const circleImage = document.querySelector(".circle-img");
      const getResponsiveValues = () => {
        if (window.innerWidth <= 420) {
          return {
            drone: [
              { x: 135, y: -37 },   // Slide 1
              { x: 296, y: 104 },  // Slide 2
              { x: -66, y: 310 },  // Slide 3
              { x: -70, y: 90 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 4, y: 0, scale: 1 }, // Slide 2
              { x: 4, y: -3, scale: 1 },// Slide 3
              { x: 6, y: -1, scale: 1 } // Slide 4
            ]
          };
        }
        else if (window.innerWidth <= 480) {
          return {
            drone: [
              { x: 111, y: -49 },   // Slide 1
              { x: 280, y: 104 },  // Slide 2
              { x: -66, y: 310 },  // Slide 3
              { x: -70, y: 90 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 6, y: 0, scale: 1 }, // Slide 2
              { x: 4, y: -3, scale: 1 },// Slide 3
              { x: 6, y: -1, scale: 1 } // Slide 4
            ]
          };
        }
        else if (window.innerWidth <= 620) {
          return {
            drone: [
              { x: 111, y: -49 },   // Slide 1
              { x: 280, y: 104 },  // Slide 2
              { x: -66, y: 310 },  // Slide 3
              { x: -70, y: 90 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 6, y: 0, scale: 1 }, // Slide 2
              { x: 4, y: -3, scale: 1 },// Slide 3
              { x: 6, y: -1, scale: 1 } // Slide 4
            ]
          };
        }
         else if (window.innerWidth <= 767) {
          return {
            drone: [
              { x: 114, y: 40 },   // Slide 1
              { x: 239, y: 175 },  // Slide 2
              { x: -75, y: 350 },  // Slide 3
              { x: -52, y: 158 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 12, y: 0, scale: 1 }, // Slide 2
              { x: 14, y: -3, scale: 1 },// Slide 3
              { x: 16, y: -5, scale: 1 } // Slide 4
            ]
          };
        }
        else if (window.innerWidth <= 1024) {
          return {
            drone: [
              { x: 114, y: 40 },   // Slide 1
              { x: 239, y: 175 },  // Slide 2
              { x: -75, y: 350 },  // Slide 3
              { x: -52, y: 158 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 12, y: 0, scale: 1 }, // Slide 2
              { x: 14, y: -3, scale: 1 },// Slide 3
              { x: 16, y: -5, scale: 1 } // Slide 4
            ]
          };
        }
         else {
          return {
            drone: [
              { x: 114, y: 40 },   // Slide 1
              { x: 303, y: 195 },  // Slide 2
              { x: -62, y: 400 },  // Slide 3
              { x: -52, y: 158 }   // Slide 4
            ],
            circle: [
              { x: 0, y: -3, scale: 1 },    // Slide 1
              { x: 12, y: 0, scale: 1 }, // Slide 2
              { x: 9, y: -3, scale: 1 },// Slide 3
              { x: 9, y: -3, scale: 1 } // Slide 4
            ]
          };
        }
      };
      const { drone, circle } = getResponsiveValues();
      if (droneImage) {
        const translationDrone = drone[currentIndex % drone.length];
        droneImage.style.transform = `translate(${translationDrone.x}%, ${translationDrone.y}%) scale(1.1)`;
        droneImage.style.transition = "transform 0.5s ease";
      }
      if (circleImage) {
        const translationCircle = circle[currentIndex % circle.length];
        circleImage.style.transform = `translate(${translationCircle.x}%, ${translationCircle.y}%) scale(${translationCircle.scale})`;
        circleImage.style.transition = "transform 0.5s ease";





















/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

.wp-dark-mode-floating-switch.wp-dark-mode-ignore.wp-dark-mode-animation.wp-dark-mode-animation-bounce {
    display: none !important;
}

.main-page-wrapper {
    margin: 0 !important;
    padding: 0 !important;
    background-color: black !important;
}

.whb-header {
    background-color: black;
    margin-bottom: 0px !important;
}

div#mainbanner {
    height: 100%;
    min-height: 780px;
    display: flex;
    align-items: center;
    margin-top: -70px;
    z-index: 9999;
}

.video-background {
    position: absolute;
    top: -158px;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.video-background video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-height: 720px;
}

.site-logo img {
    max-height: 100px !important;
    width: 100%;
    max-width: 290px !important;
    transform: none !important;
    perspective: none !important;
    height: 100% !important;
    padding: 0 !important;
}

a.wd-logo.wd-sticky-logo {
    margin-top: -15px !important;
    /* transition: none; */
}

.whb-general-header {
    height: 110px !important;
    display: flex;
    align-items: center;
    /* backdrop-filter: blur(30px); */
    background-color: rgba(255, 255, 255, 0.04) !important;
}

.wd-prefooter {
    padding-bottom: 0 !important;
}

ul#menu-mainmenu li a {
    text-transform: capitalize;
    color: #fff;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    opacity: 0.6;
}

ul#menu-mainmenu li {
    margin-left: 10px;
}

ul#menu-mainmenu li a:hover {
    opacity: 2;
}

ul#menu-mainmenu li.current-menu-item a {
    opacity: 2;
}

.mainbtn {
    text-transform: capitalize;
    color: #fff !important;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    border-radius: 500px;
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    box-shadow: none !important;
}

.homecontentbox .info-box-inner {
    width: 70%;
    margin: 0 auto;
    font-weight: 300;
}

.homecontentbox {
    margin: 60px 0 0 !important;
}

div#togglebutton a {
    background: linear-gradient(92deg,
            #004999 -19.88%,
            #00efeb 107.62%) !important;
    color: #fff !important;
    font-size: 12px !important;
    border: none !important;
    -webkit-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
}

div#togglebutton a:hover {
    -webkit-animation: none;
    animation: none;
}

div#togglebutton a .vc_btn3-icon {
    font-size: 23px !important;
    height: 11px !important;
    line-height: 14px !important;
    font-weight: 600 !important;
}

@-webkit-keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}

div#togglebutton {
    position: relative;
    top: 80px;
    margin-bottom: 0 !important;
    z-index: 9999;
}

div#aboutsec {
    padding: 100px 0;
}

#leftimgsect {
    display: flex;
    align-items: center;
    position: relative !important;
}

#leftimgsect2 {
    display: flex;
    align-items: center;
}

#rightimgsect {
    display: flex;
    align-items: center;
}

.drone-sect {
    padding: 100px 0;
}

.whb-main-header {
    background: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(30px);
    background-color: rgba(255, 255, 255, 0.04) !important;
    box-shadow: none !important;
    z-index: 9999999 !important;
}

.card-content {
    height: 100%;
    min-height: 220px;
    padding: 30px 20px 0;
}

.card-description p {
    color: #fff;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    margin: 0 !important;
    line-height: 23px;
}

.card-description p {
    color: #fff;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    margin: 0 !important;
    line-height: 26px;
}

.service-card-sect .card img {
    width: 100%;
}

.service-card-sect .card {
    background-color: #202020;
    color: #fff;
    border-radius: 30px;
    margin-bottom: 40px;
    border: none !important;
    transition: 0.3s all;
    cursor: pointer;
}

footer.footer-container.color-scheme-dark {
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.1);
    padding: 100px 0 0;
}

.service-card-sect .card:hover {
    background: linear-gradient(92deg,
            #004999 -19.88%,
            #00efeb 107.62%) !important;
}

div#leftimgsect:before {
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0;
    width: 50%;
    height: 510px;
    background-image: url(img/leftbefore.png);
    background-size: 95%;
    background-repeat: no-repeat;
    background-position: left;
}

div#leftimgsect2:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -70px;
    width: 50%;
    height: 520px;
    background-image: url(img/leftbefore.png);
    background-size: 100% 66%;
    background-repeat: no-repeat;
    background-position: left;
}

div#rightimgsect:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 490px;
    background-image: url(img/rightbefore.png);
    background-size: 120%;
    background-repeat: no-repeat;
    background-position: left;
}

div#leftimgsect2 .info-box-wrapper {
    padding-left: 70px;
}

div#leftimgsect .info-box-wrapper {
    padding-left: 40px;
}

h2#wework {
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-bottom: 90px;
}

div#buttonimg {
    margin: 0 -6px;
}

div#mobilebtnsect {
    padding: 70px 0 140px;
}

div#mobilebtnsect h2#wework {
    margin-bottom: 50px;
}

.service-card-sect .card .card-content h2 {
    font-family: "Karla";
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    color: #fff;
}

div#servicesect {
    padding: 50px 0 50px;
}

div#mobileimg1 img {
    width: 100%;
    max-width: 400px !important;
}

div#mobileimg2 img {
    width: 100%;
    max-width: 400px !important;
}

.simple-box .info-box-title {
    line-height: 45px !important;
    margin-bottom: 25px !important;
}

div#mobileimg3 img {
    width: 100%;
    max-width: 380px !important;
}

div#footerlogo img {
    width: 100%;
}

div#copyrighttext p {
    margin: 0 !important;
    color: #fff;
    font-size: 20px;
}

.newsletter-signup h3 {
    color: #fff;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 50px;
}

.newsletter-signup {
    text-align: center;
}

h2#footerhead {
    color: #fff;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 40px;
}

.newsletter-input input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
    border: none !important;
    color: #fff;
    padding: 0;
}

div#footerlogo {
    margin-bottom: 80px;
}

.newsletter-input input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required::placeholder {
    color: #fff;
    font-family: "BAGOS";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    opacity: 0.7;
}

.newsletter-input input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required::focus {
    color: #fff;
    font-family: "BAGOS";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    opacity: 0.7;
}

.newsletter-input input.news-send {
    border-radius: 10px;
    background: #fff;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    color: #004999;
    width: 20%;
     padding: 12px;
    height: 50px !important;
}

.newsletter-signup span.wpcf7-not-valid-tip {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
}

footer .screen-reader-response {
    display: none !important;
}
.newsletter-input p {
    width: 60%;
    margin: 0 auto;
    display: flex;
    text-align: center;
    justify-content: space-between;
    border-bottom: 1px solid #fff;
    padding-bottom: 18px;
}

.newsletter-input span.wpcf7-spinner {
    display: none !important;
}

span.wpcf7-form-control-wrap {
    width: 100%;
}

div#footerrow {
    padding: 80px 0 40px;
}

div#footermenu ul li a {
    color: #fff;
    font-family: "BAGOS";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

div#footermenu ul li span.list-content {
    color: #fff;
    font-family: "BAGOS";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

div#footermenu ul li {
    padding-bottom: 8px;
}

div#footermenu ul.wd-list-type-icon {
    margin-bottom: 10px !important;
}

div#footermenu ul li span.list-icon {
    font-size: 24px;
}

.galleryswiper {
    width: 1055px;
    padding-top: 50px;
    padding-bottom: 50px;
}

.galleryswiper .swiper-slide {
    width: 345px;
}

.galleryswiper .swiper-slide img.slide-img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 20px;
    border: 4px solid #004999;
    position: relative;
}

.social-links span.wd-label {
    font-size: 22px;
    width: 100%;
}

.galleryswiper .swiper-slide {
    border-radius: 20px;
}

.galleryswiper .swiper-slide.swiper-slide-active:before {
    display: none !important;
}

.galleryswiper .swiper-slide:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(0deg,
            rgba(255, 255, 255, 0.35) 0%,
            rgba(255, 255, 255, 0.35) 100%),
        lightgray;
    z-index: 999999;
    width: 100%;
    height: 100%;
    opacity: 0.4;
    border-radius: 20px;
    transition: 0.3s ease-in;
}

.gallery-swiper-wrapper .swiper-button-next:after {
    content: "" !important;
    font-size: 0 !important;
}

.gallery-swiper-wrapper .swiper-button-prev:after {
    content: "" !important;
    font-size: 0 !important;
}

.gallery-swiper-wrapper .swiper-button-next,
.gallery-swiper-wrapper .swiper-button-prev {
    width: 50px;
}

.gallery-swiper-wrapper .swiper-button-next {
    transform: translate(-40px, 52px);
}

.gallery-swiper-wrapper .swiper-button-prev {
    transform: translate(40px, 50px);
}

div#galleryslidersect {
    background-color: #202020;
    padding: 100px 0 60px;
}

.faqcontbox {
    flex-direction: column-reverse !important;
}

div#questionsect .faqcontbox svg {
    width: 530px !important;
    height: 350px  !important;
    object-fit: cover;
    margin-left: -120px;
}

div#questionsect {
    padding: 130px 0 0;
}

div#questionsect .info-svg-wrapper.info-icon {
    width: 100% !important;
    height: 100% !important;
}

.faq-wrapper .accordion-button:not(.collapsed) {
    background-color: #ffffff00 !important;
    border-radius: 13px !important;
    color: #fff;
    padding-bottom: 20px !important;
}

.faq-wrapper button.accordion-button.collapsed {
    border-radius: 30px !important;
}

.faq-wrapper .accordion-button {
    background-color: #202020 !important;
    box-shadow: none !important;
    border: none !important;
    padding: 32px 40px;
    color: #fff;
    font-family: "Karla";
    font-size: 22px;
    font-weight: 400;
    text-align: left;
    display: flex;
    justify-content: flex-start;
}

.faq-wrapper .accordion-button span {
    margin-left: 22px;
    text-transform: math-auto;
}

.faq-wrapper .accordion-item {
    background-color: #202020 !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 13px !important;
    margin-bottom: 15px;
}

.faq-wrapper .accordion-body {
    background-color: #202020 !important;
    padding: 8px 28px 30px;
    color: #fff;
    border-radius: 13px;
}

.accordion-body p {
    margin: 0;
    font-family: "Karla";
    font-size: 18px;
    font-weight: 400;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 18px;
}

.faqcontbox .info-box-inner {
    width: 75%;
}

.faq-wrapper .accordion-header {
    background-color: #ffffff00 !important;
    border-radius: 13px !important;
}

.faq-wrapper .accordion-button.collapsed::before {
    content: "\002B";
}

.accordion-button:not(.collapsed)::after {
    display: none !important;
}

.faq-wrapper .accordion-button::before {
    content: "\2212";
    font-size: 38px;
    position: absolute;
    left: 20px;
    color: #fff;
    background-color: transparent !important;
    border: none !important;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 7px;
    font-weight: 300;
}

.error404 .main-page-wrapper {
    background-image: url(img/404.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}

.page-id-164 .main-page-wrapper {
    background-image: url(img/404.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}

.error404 .main-page-wrapper .site-content.col-12 {
    padding: 116px 0 90px;
}

.error404 .page-header:before {
    font-weight: 500 !important;
}

.error404 .page-content p {
    text-align: center;
    font-family: "Karla";
    font-size: 34px !important;
    font-style: normal;
    font-weight: 400;
    color: #fff;
    line-height: 38px;
    margin: 70px 0 10px;
}

a.erorrbutton {
    text-transform: capitalize;
    color: #fff !important;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    border-radius: 500px;
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    box-shadow: none !important;
    padding: 14px 40px;
    position: relative;
    top: 50px;
}

div#thankyoubtn a {
    text-transform: capitalize;
    color: #fff !important;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    border-radius: 500px;
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    box-shadow: none !important;
    padding: 14px 40px;
    border: none;
}

.thank-box .info-box-inner {
    width: 40%;
    margin: 30px auto 10px;
}

div#thanksect {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    min-height: 560px;
    padding-bottom: 30px;
}

.page-title {
    height: 100%;
    min-height: 340px;
    padding: 0 !important;
    display: flex;
    align-items: flex-end;
    margin: 0px !important;
    background-color: transparent !important;
}

/* .page-title::after {
      content: '';
      position: absolute;
      width: 100%;
      height: 300px;
      bottom: 0; 
      box-shadow: 0px 20px 30px rgba(13, 15, 15, 0.56);
      background: linear-gradient(0deg, rgba(14, 14, 14, 0.73) 0%, rgba(14, 14, 14, 0.00) 100%);
      filter: blur(10px); 
      z-index: -1;
  } */

.page-title .breadcrumbs {
    display: none;
}

.contact-box .info-box-inner {
    width: 77%;
    margin: 36px 0 26px;
}

.social-links {
    padding-top: 24px !important;
}

.social-links a.wd-social-icon.social-instagram {
    background: linear-gradient(315deg,
            #fbe18a 0.96%,
            #fcbb45 21.96%,
            #f75274 38.96%,
            #d53692 52.96%,
            #8f39ce 74.96%,
            #5b4fe9 100.96%);
    border-radius: 15px !important;
    box-shadow: none !important;
    margin-right: 20px !important;
}

div#contactsect .social-links span.wd-icon {
    font-size: 30px !important;
    line-height: 0 !important;
}

div#contactsect .wd-social-icons {
    display: flex;
    flex-wrap: wrap;
}

.social-links a.wd-social-icon.social-youtube {
    background-color: #ff0000 !important;
    border-radius: 15px !important;
    box-shadow: none !important;
}

.homecontentbox {
    position: relative;
    z-index: 9999;
}

div#lottie-animation svg {
    width: 770px !important;
    height: 450px !important;
    position: relative;
    right: -120px;
}

.form-image {
    text-align: center;
}

.contact-man-form {
    border-radius: 20px;
    background: #202020;
    position: relative;
    padding: 30px 30px;
    top: -30px;
}

.contact-man-form label {
    color: #fff;
    font-family: Karla;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
}

.contact-man-form .form-row input {
    border-radius: 16px !important;
    background-color: #35363a !important;
    border: none !important;
    height: 60px !important;
}

.contact-man-form .form-row textarea {
    border-radius: 16px !important;
    background-color: #35363a !important;
    border: none !important;
    height: 150px !important;
    min-height: 100% !important;
}

div#contactcol .wpb_wrapper {
    position: relative;
    padding: 0 30px 0px;
    border-top: 0px !important;
    border-radius: 20px;
}

div#contactcol .wpb_wrapper:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    top: 0;
    background: linear-gradient(75deg, #004999 -17.88%, #00efeb 110.62%);
    left: 0px;
    border-radius: 20px;
    border: 14px solid #56b9f2;
}

div#contactsect .icons-size-large .wd-social-icon {
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.page-id-177 div#contactsect {
    padding: 14rem 0 5rem;
    overflow: hidden;
}
.page-id-177
div#contactsect:before{
    bottom: 150px;
}

div#contactsect:before {
    content: "";
    position: absolute;
    left: -40px;
    width: 780px;
    height: 690px;
    background-image: url(img/contact-before.svg);
    background-size: 90%;
    z-index: 0;
    background-repeat: no-repeat;
    background-position: top;
    bottom: 270px;
}

.page-id-177 .main-page-wrapper {
    background-image: url(img/contactusbg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    margin: -100px 0 0 !important;
}

.page-id-177 .main-page-wrapper .page-title-default .entry-title.title {
    padding-bottom: 10px;
}

.form-row-sumbit input {
    text-transform: capitalize;
    color: #fff !important;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    border-radius: 500px;
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    box-shadow: none !important;
    padding: 12px 42px;
}

div#faqtitttle h1 {
    color: #fff;
    text-align: center;
    font-family: "Karla";
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 58px;
}

div#faqtitttle h1 strong {
    background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Karla;
}

div#faqcontent p {
    font-family: Karla;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #fff;
    margin: 0 auto;
    width: 50%;
}

div#faqheader {
    padding: 100px 0 100px;
}

.page-id-230 .main-page-wrapper {
    background-image: url(img/faqbg.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top;
    margin: -10px 0 0 !important;
}

.page-id-183 .main-page-wrapper {
    background-image: url(img/servicebg.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top;
    margin: -10px 0 0 !important;
}

div#mainfaqsect {
    padding: 10rem 0 2rem;
}

.page-id-230 div#contactsect {
    padding: 17rem 0 0;
}

div#mainfaqsect .faq-wrapper {
    width: 80%;
    margin: 0 auto;
}

div#faqtitttle h1 strong {
    font-weight: 700 !important;
}

div#serviceheader div#faqcontent p {
    margin: 0;
    width: 75%;
}

div#serviceheader div#faqtitttle h1 strong {
    background: none;
    color: #56b9f2 !important;
    -webkit-text-fill-color: #56b9f2 !important;
}

div#serviceheader {
    padding: 200px 0;
}

.service-box {
    height: 350px;
    margin-bottom: 35px;
    border-radius: 16px;
    position: relative;
    display: flex;
    align-items: flex-end;
    padding: 0px 20px;
    object-fit: cover;
}

.service-box-content h2 {
    color: #fff;
    font-family: "Karla";
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    font-size: 30px;
    transition: transform 0.3s ease-in-out;
    margin-bottom: 0 !important;
}

.service-box-description p {
    color: #fff;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.service-box-description {
    width: 100%;
    transition: opacity 0.3s ease-in;
    margin-left: auto;
    opacity: 0;
}

.service-box:hover .service-box-description {
    opacity: 1;
}

.service-box:hover .service-box-content h2 {
    transform: translateY(-20px);
}

div#servicemainsect {
    padding-top: 80px;
}

.page-id-183 div#contactsect {
    padding: 200px 0 100px;
}

div#galleryheader {
    padding: 100px 0;
}

div#galleryheader div#faqcontent p {
    margin: 0;
    width: 85%;
}

.page-id-181 h2#wework {
    margin-bottom: 35px;
}

.galleryhome-swiper-wrapper .swiper-slide img {
    width: 100%;
    height: 100%;
    min-height: 540px;
    object-fit: cover;
    border-radius: 16px;
}

div#faqboxcol {
    padding: 50px 0 0 100px;
}

.galleryhome-swiper-wrapper {
    position: relative;
}

.galleryhome-swiper-wrapper:before {
    content: "";
    position: absolute;
    width: 550px;
    height: 530px;
    opacity: 0.5;
    background: var(--Gradient-Color,
            linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%),
            linear-gradient(92deg, #ff6801 1.46%, #993e01 84.37%));
    filter: blur(155.1724090576172px);
    z-index: 0;
}

div#heartimg img {
    width: 100%;
    object-fit: cover;
    max-width: 350px;
}

div#heartimg {
    margin: 0 !important;
}

div#thanksect .vc_column-inner {
    padding: 0 !important;
}

div#mobilebtnsect div#appbuttonrow img {
    position: relative !important;
    left: 0 !important;
}


div#appbuttonrow img {
    width: 100%;
    max-width: 230px;
    object-fit: cover;

}

div#aboutheader {
    height: 630px;
}

button#lg-next-1 {
    position: absolute;
}

div#lg-outer-1 {
    z-index: 999999999;
}

div#lg-backdrop-1 {
    z-index: 99999999;
}

.gallery-container {
    flex-wrap: wrap;
    display: flex;
    margin-top: 70px;
}

.gallery-inner {
    width: 15%;
    text-align: center;
    cursor: pointer;
    margin: 0 5px 15px;
}

a.gallery-inner img {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
}

div#galleryimagessect {
    padding: 100px 0 100px;
}

div#aboutheader div#faqcontent p {
    margin: 0;
    width: 100%;
}

div#aboutcontentcol {
    padding-top: 90px;
}

div#aboutsecondsect {
    padding: 100px 0 100px;
    position: relative;
    background-image: linear-gradient(349deg,
            #22272b 7.94%,
            rgba(14, 14, 14, 0) 72.21%);
}

.aerial-about {
    color: #fff;
    font-family: Karla;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
}

div#img1 img {
    width: 100%;
    max-width: 540px;
    object-fit: cover;
    border-radius: 18px;
    position: relative;
}

div#img2 img {
    width: 100%;
    max-width: 540px;
    object-fit: cover;
    border-radius: 18px;
    z-index: 999;
    position: relative;
}

.team-content-box img.info-icon.image-1 {
    width: 100%;
    max-width: 140px;
    object-fit: cover;
}

.team-content-box .info-box-title {
    position: absolute;
    top: 0;
}

div#leftteamrow {
    padding: 0 50px 100px;
}

div#rightteamrow {
    padding: 0 50px 0;
}

.team-content-box .info-box-subtitle {
    padding-top: 60px;
}

div#teamsect {
    padding: 150px 0;
}

div#teamsect:before {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    width: 450px;
    height: 550px;
    opacity: 0.5;
    background: var(--Second-Primary-Color,
            linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%));
    filter: blur(150px);
}

div#teamsect:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 9%;
    width: 470px;
    height: 500px;
    opacity: 0.5;
    background: var(--Second-Primary-Color,
            linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%));
    filter: blur(150px);
}



div#quipimg img {
    margin-bottom: -54px;
    width: 100%;
    max-width: 960px;
    object-fit: cover;
    position: relative;
    z-index: 99;
}



.equip-box {
    position: relative;
}

div#equipsrows .info-box-inner p {
    width: 60%;
    margin: 0 auto;
}

div#equipsrows {
    padding-bottom: 20px;
}

div#equipsect {
    padding-top: 100px;
}

div#equipsect:before {
    content: "";
    position: absolute;
    left: 0;
    border-radius: 1808px;
    background: #fff;
    bottom: -80%;
    margin: 0 auto;
    right: 0;
    width: 1040px;
    height: 1020px;
    z-index: 0;
}


.page-id-23 div#contactsect {
    padding: 150px 0;
}

.page-id-296 div#propertinformobileimg img {
    width: 100%;
    max-width: 400px;
    object-fit: cover;
}

div#employedsect div#appbuttonrow .wpb_wrapper {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

div#employedsect div#buttonimg {
    margin: 0px 30px 0 0px;
    width: fit-content;
}

div#employedsect h2#wework {
    margin-bottom: 20px !important;
}

div#employedsect {
    height: 100%;
    min-height: 950px;
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    padding-top: 60px;
    margin-top: 100px;
    margin-bottom: 100px;
}

div#employedariellogo {
    margin-bottom: 10px;
}

div#employedcol {
    padding-left: 80px;
}

div#appfeaturebg {
    background-size: 100% !important;
    background-position: bottom;
    background-repeat: no-repeat;
    padding-bottom: 30px;
    margin-bottom: 50px;
}

div#appfeaturebg:before {
    content: "";
    position: absolute;
    top: 10%;
    right: 10%;
    width: 500px;
    height: 360px;
    background-image: url(img/dronecamera.svg);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
}

div#mainappimg img {
    width: 100%;
    max-width: 350px;
    object-fit: cover;
}

div#mainappimg {
    margin: 0 !important;
}

div#appfeaturethmubimg img {
    width: 100%;
    max-width: 480px;
    object-fit: cover;
}

div#appfeaturesect div#faqcontent p {
    margin: 0;
    width: 80%;
}

div#appfeaturesect {
    padding: 80px 0;
}

div#mobileappbtnwrapper .wpb_column.vc_column_container.vc_col-sm-6 {
    width: fit-content;
}

div#mobileappbtnwrapper img {
    width: 100%;
    max-width: 190px;
    object-fit: cover;
}

h4#solutionheading {
    color: #fff;
    font-family: "Karla";
    font-size: 40px;
    font-style: normal;
    font-weight: 500;
    width: 50%;
    line-height: 46px;
}

.swiper-number h3 {
    color: #56b9f2;
    font-family: "Karla";
    font-size: 220px;
    font-style: normal;
    font-weight: 500;
    line-height: 260px;
    letter-spacing: -7px;
}

.swiper-content {
    padding-left: 50px;
}

.swiper-content p {
    color: #fff;
    font-family: "Karla";
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 56px;
    margin: 0;
}

.solutionswiper-inner {
    display: flex;
    align-items: center;
}

.solution-swiper-wrapper .swiper-button-next:after {
    content: "" !important;
    font-size: 0 !important;
}

.solution-swiper-wrapper .swiper-button-prev:after {
    content: "" !important;
    font-size: 0 !important;
}

div#solutionsect {
    border-radius: 40px;
    background: #202020;
    margin: 0 4px 100px;
    padding: 70px 0 80px 140px !important;
    position: relative;
}

.solution-swiper-wrapper .swiper-button-next,
.solution-swiper-wrapper .swiper-button-prev {
    background-color: #fff;
    border-radius: 100%;
    width: 50px;
    height: 50px;
    top: 100%;
    margin-right: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0px;
}

div#solutionsect .vc_column-inner {
    padding: 0 !important;
}

.solution-swiper-wrapper {
    position: relative;
}

.solution-swiper-wrapper .swiper-button-prev {
    right: 70px !important;
    left: inherit;
}

.solutionswiper {
    padding-top: 30px;
    padding-left: 40px;
}

.rotatedroneimg-img {
    transition: transform 0.5s ease;
    transform-origin: center;
}

.rotatedroneimg-img:hover {
    cursor: pointer;
}

img.circle-img {
    position: absolute;
    top: 65px;
    width: 100%;
    left: -2px;
    max-width: 192px;
}

img.rotatedroneimg-img {
    position: absolute;
    top: 20px;
    width: 48px;
}

.wd-toolbar.wd-toolbar-label-show.woodmart-toolbar-label-show.woodmart-toolbar {
    height: 0 !important;
    display: none !important;
}

.mobile-nav {
    z-index: 999999999 !important;
    width: 450px !important;
    background-color: #000 !important;
    /* background: linear-gradient(92deg, #004999 -19.88%, #00efeb 107.62%); */
}

.mobile-nav .wd-action-btn.wd-style-text>a:before {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0em;
    height: 0em;
    font-size: 22px;
    font-weight: 400;
    opacity: 2;
    filter: brightness(6.5);
}

.mobile-nav .wd-action-btn.wd-style-text>a {
    position: relative;
    font-weight: 600;
    font-size: 0px !important;
    line-height: 1;
    color: #f2e0d6;
}

.wd-header-mobile-nav .wd-tools-icon:before {
    font-size: 40px !important;
}

.mobile-nav ul li a {
    text-transform: capitalize;
    color: #fff !important;
    font-family: "Karla";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    opacity: 0.6;
}

.mobile-nav ul li.current-menu-item a {
    opacity: 2;
}

.mobile-nav ul li a:hover {
    opacity: 2;
}

.wd-nav-mobile li a {
    border-bottom: none !important;
}

.mobil
    

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Ice Cream Hero</title>
    <style>
      * {
        box-sizing: border-box;
      }

      body,
      html {
        margin: 0;
        padding: 0;
        font-family: "Poppins", sans-serif;
        background: #00aaff;
        overflow: hidden;
      }

      .hero-section {
        width: 100vw;
        height: 100vh;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 50px;
        overflow: hidden;
      }
img.floating.float6.active {
    left: 1px;
}
      .hero-text {
        max-width: 40%;
        color: white;
        opacity: 0;
        transform: translateX(-100px);
        transition: all 1s  ease-out;
        /* Slowed from 1s to 1.8s */
        z-index: 3;
      }

      .hero-text.show {
        opacity: 1;
        transform: translateX(0);
      }

      .hero-text h1 {
        font-size: 3rem;
        margin-bottom: 1rem;
      }

      .hero-text p {
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
      }

      .btns img {
        width: 150px;
        margin-right: 10px;
        transition: all 0.8s ease;
        /* Slowed from 0.5s to 0.8s */
      }

      .btns img:hover {
        transform: scale(1.05);
      }

      .main-image {
        height: 100%;
        max-height: 90vh;
        opacity: 0;
        transform: translateY(80px);
        position: absolute;
        right: 50px;
        transition: all 2.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        /* Slowed from 1.5s to 2.2s */
        z-index: 2;
      }

      .main-image.loaded {
        opacity: 1;
        bottom: 0;
        left: 38%;
        transform: translateY(0) translateX(0);
      }

      .main-image.active {
        transform: rotate(5deg);
        left: 63%;
        bottom: 0;
        transition: all 1.5s ease;
        /* Slowed from 1s to 1.5s */
      }

      .floating {
        position: absolute;
        opacity: 0;
        transform: translateY(80px);
        transition: all 2.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      }

      .floating.loaded {
        opacity: 1;
        transform: translateY(0);
      }

img.floating.float1.active {
    left: 61%;
    top: 4%;
}
      .floating.active {
        transition: all 1.8s ease;
      }
img.floating.float4.active {
    bottom: 4%;
    right: 35%;
        z-index: 999;
}
img.floating.float3.active {
    bottom: 32%;
    left: 55%;
}
      .float1 {
        top: 9%;
        left: 9%;
        transition-delay: 0.2s;
      }
img.floating.float2.active {
    top: 8%;
    right: 14%;
}

      .float2 {
        top: 13%;
        right: 28%;
        transition-delay: 0.3s;
        width: 80px;
      }

      .float3 {
        bottom: 32%;
        left: 30%;
        transition-delay: 0.4s;
      }

      .float4 {
        bottom: 20%;
        right: 32%;
        transition-delay: 0.5s;
        width: 110px;
      }

      .float5 {
        top: 50%;
        right: 1%;
        transition-delay: 0.6s;
        width: 102px;
      }

.float6 {
    bottom: 4%;
    left: -2%;
    transition-delay: 0.7s;
    width: 190px;
}
      .float7 {
        bottom: 0px;
        right: 4%;
        transition-delay: 0.8s;
        width: 200px;
      }
    </style>
  </head>

  <body>
    <div class="hero-section">
      <div class="hero-text">
        <h1>ICE CREAM ON THE BOAT</h1>
        <p>
          Make your picnic by the lake even more memorable with our on-demand
          ice cream app. Whether you're relaxing with fam, spending time with
          friends, or vibing solo – we deliver frozen treats straight to your
          picnic spot.
        </p>
        <div class="btns">
          <img src="appstore.png" alt="App Store" />
          <img src="playstore.png" alt="Google Play" />
        </div>
      </div>

      <div id="mainimagebox">
        <img
          src="/images/hands-phone.png"
          class="main-image"
          alt="Phone"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/cone.png"
          class="floating float1"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/blueberry.png"
          class="floating float2"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/blur-blueberry.png"
          class="floating float3"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/cup.png"
          class="floating float4"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/chocbar.png"
          class="floating float5"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/boat-left.png"
          class="floating float6"
          onload="imageLoaded(this)"
        />
        <img
          src="/images/blur-boat.png"
          class="floating float7"
          onload="imageLoaded(this)"
        />
      </div>
    </div>

    <script>
      function imageLoaded(img) {
        img.classList.add("loaded");

        if (
          img.classList.contains("main-image") ||
          img.classList.contains("floating")
        ) {
          setTimeout(() => {
            img.classList.add("active");
          }, 4000);
        }
      }

      window.addEventListener("DOMContentLoaded", () => {
        const heroText = document.querySelector(".hero-text");

        setTimeout(() => {
          heroText.classList.add("show");
        }, 5000);
      });
    </script>
  </body>
</html>

:500

<head>
  <meta charset="utf-8" />
  <title>My test page</title>
</head>

// Total number of reviews for current product [count_reviews
add_shortcode('count_reviews', function() {
    $product_id = get_queried_object_id();

    if ( ! $product_id ) {
        return '';
    }

    $args = array(
        'post_type'      => 'simple-reviews',
        'post_status'    => 'publish',
        'posts_per_page' => -1,
        'meta_query'     => array(
            array(
                'key'     => 'review_post_id',
                'value'   => $product_id,
                'compare' => '=',
            ),
            array(
                'key'     => 'rating_review',
                'value'   => '',
                'compare' => '!=',
            ),
        ),
        'fields' => 'ids',
    );

    $query = new WP_Query($args);
    $total_reviews = count($query->posts);

    $label = plural_form($total_reviews, 'отзыв', 'отзыва', 'отзывов');

    return "{$total_reviews} {$label}";
});

// Функция склонения слов по числам
function plural_form($number, $form1, $form2, $form5) {
    $n = abs($number) % 100;
    $n1 = $n % 10;
    if ($n > 10 && $n < 20) return $form5;
    if ($n1 > 1 && $n1 < 5) return $form2;
    if ($n1 == 1) return $form1;
    return $form5;
}

import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { McButton, McInput } from '@maersk-global/mds-react-wrapper';
import { McSelect } from '@maersk-global/mds-react-wrapper/components-core/mc-select';
import { McOption } from '@maersk-global/mds-react-wrapper/components-core/mc-option';
import styles from '../styles/CreateRule.module.css';
import data from '../data/PnLGroup.json';

const CreateRules = () => {
  const navigate = useNavigate();
  const [activeTab, setActiveTab] = useState('ruleInfo');
  const [ruleData, setRuleData] = useState({
    num: '',
    name: '',
    desc: '',
    custRefID: '',
    ruleGroup: '',
    isActive: 'Y',
    pnlGroup: '',
  });
  const [steps, setSteps] = useState([
    {
      stepNo: '',
      stepName: 'Single Step',
      StepDesc: '',
      stepType: 'S',
      preAggregatorColumns: '',
      sourceTable: '',
      sourceFilters: '',
      joinColumns: '',
      allocationColumns: '',
      driverTableID: '',
      driverWeightColumn: '',
      driverFilters: '',
    },
  ]);
  const [errors, setErrors] = useState({ rule: {}, steps: [{}] });

  // Extract PnL Group options from JSON, with fallback for empty data
  const pnlGroups = data.PnLGroups ? Object.keys(data.PnLGroups) : [];

  // Get Rule Group options based on selected PnL Group, with fallback
  const ruleGroups = ruleData.pnlGroup && data.PnLGroups[ruleData.pnlGroup]
    ? data.PnLGroups[ruleData.pnlGroup].RuleGroups || []
    : [];

  const addStep = () => {
    setSteps((prevSteps) => [
      ...prevSteps,
      {
        stepNo: '',
        stepName: 'Single Step',
        StepDesc: '',
        stepType: 'S',
        preAggregatorColumns: '',
        sourceTable: '',
        sourceFilters: '',
        joinColumns: '',
        allocationColumns: '',
        driverTableID: '',
        driverWeightColumn: '',
        driverFilters: '',
      },
    ]);
    setErrors((prevErrors) => ({
      ...prevErrors,
      steps: [...prevErrors.steps, {}],
    }));
  };

  const validateForm = () => {
    const newErrors = { rule: {}, steps: steps.map(() => ({})) };
    let isValid = true;

    // Validate rule data
    Object.keys(ruleData).forEach((key) => {
      if (key !== 'isActive' && !ruleData[key]) {
        newErrors.rule[key] = 'This field is required';
        isValid = false;
      }
    });

    // Validate steps
    steps.forEach((step, index) => {
      const stepErrors = {};
      Object.keys(step).forEach((key) => {
        if (key !== 'stepName' && key !== 'stepType' && !step[key]) {
          stepErrors[key] = 'This field is required';
          isValid = false;
        }
      });
      newErrors.steps[index] = stepErrors;
    });

    setErrors(newErrors);
    return isValid;
  };

  const handleInputChange = (e, stepIndex = null) => {
    const { name, value } = e.target;
    console.log(`Input changed: ${name} = ${value}${stepIndex !== null ? ` (Step ${stepIndex + 1})` : ''}`);
    
    if (stepIndex !== null) {
      setSteps((prevSteps) => {
        const newSteps = [...prevSteps];
        newSteps[stepIndex] = { ...newSteps[stepIndex], [name]: value };
        return newSteps;
      });
      setErrors((prevErrors) => ({
        ...prevErrors,
        steps: prevErrors.steps.map((stepErrors, i) =>
          i === stepIndex ? { ...stepErrors, [name]: '' } : stepErrors
        ),
      }));
    } else {
      setRuleData((prevData) => ({
        ...prevData,
        [name]: value,
        ...(name === 'pnlGroup' ? { ruleGroup: '' } : {}),
      }));
      setErrors((prevErrors) => ({
        ...prevErrors,
        rule: { ...prevErrors.rule, [name]: '' },
      }));
    }
  };

  const handleSelectChange = (e) => {
    const { name, value } = e.target;
    console.log(`Select changed: ${name} = ${value}`);
    setRuleData((prevData) => ({
      ...prevData,
      [name]: value,
      ...(name === 'pnlGroup' ? { ruleGroup: '' } : {}),
    }));
    setErrors((prevErrors) => ({
      ...prevErrors,
      rule: { ...prevErrors.rule, [name]: '' },
    }));
  };

  const handleSave = async () => {
    if (!validateForm()) {
      console.log('Validation failed:', errors);
      alert('Please fill out all required fields.');
      return;
    }

    // Parse comma-separated columns and filters
    const parseColumns = (input) => input.split(',').map((item) => item.trim()).filter((item) => item);
    const parseFilters = (input) => {
      const filters = input.split(';').map((item) => item.trim()).filter((item) => item);
      return filters.map((filter) => {
        const [name, filterType, values] = filter.split(':').map((item) => item.trim());
        return { name, filterType, values };
      });
    };

    const ruleJson = {
      rules: {
        rule: [
          {
            num: ruleData.num,
            name: ruleData.name,
            desc: ruleData.desc,
            custRefID: ruleData.custRefID,
            ruleGroup: ruleData.ruleGroup,
            isActive: ruleData.isActive,
            Step: steps.map((step, index) => ({
              stepNo: step.stepNo || `${ruleData.num}.${index + 1}`,
              stepName: step.stepName === 'Single Step' ? 'single' : 'multi',
              StepDesc: step.StepDesc,
              stepType: step.stepType,
              isActive: 'Y',
              SourceTable: {
                id: '1',
                Name: step.sourceTable,
              },
              sourceFilters: {
                columns: parseFilters(step.sourceFilters),
              },
              preAggregator: {
                columns: parseColumns(step.preAggregatorColumns),
              },
              join: {
                columns: parseColumns(step.joinColumns),
              },
              allocation: {
                columns: parseColumns(step.allocationColumns),
              },
              driver: {
                driverTableID: step.driverTableID,
                driverWeightColumn: step.driverWeightColumn,
                driverFilters: {
                  columns: parseFilters(step.driverFilters),
                },
              },
            })),
          },
        ],
      },
    };

    console.log('Saving Rule Data:', JSON.stringify(ruleJson, null, 2));

    try {
      const response = await fetch('/api/rules', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(ruleJson),
      });

      if (response.ok) {
        console.log('Rule created successfully');
        navigate('/');
      } else {
        console.error('Failed to create rule:', response.statusText);
        alert('Failed to create rule. Please try again.');
      }
    } catch (error) {
      console.error('Error during API call:', error);
      alert('An error occurred while saving the rule.');
    }
  };

  const handleCancel = () => {
    console.log('Cancelling rule creation');
    navigate('/');
  };

  const renderTabContent = () => {
    console.log('Rendering tab:', activeTab);
    switch (activeTab) {
      case 'ruleInfo':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Rule Information</h3>
            <div className={styles.formGrid}>
              <div className={styles.gridItem}>
                <McSelect
                  label="PnL Group"
                  name="pnlGroup"
                  value={ruleData.pnlGroup}
                  optionselected={handleSelectChange}
                  placeholder="Select a PnL Group"
                  required
                  invalid={!!errors.rule.pnlGroup}
                  invalidmessage={errors.rule.pnlGroup}
                >
                  {pnlGroups.map((group) => (
                    <McOption key={group} value={group}>
                      {group}
                    </McOption>
                  ))}
                </McSelect>
              </div>
              <div className={styles.gridItem}>
                <McSelect
                  label="Rule Group"
                  name="ruleGroup"
                  value={ruleData.ruleGroup}
                  optionselected={handleSelectChange}
                  placeholder={ruleGroups.length ? "Select a Rule Group" : "Select a PnL Group first"}
                  required
                  disabled={!ruleData.pnlGroup || !ruleGroups.length}
                  invalid={!!errors.rule.ruleGroup}
                  invalidmessage={errors.rule.ruleGroup}
                >
                  {ruleGroups.map((group) => (
                    <McOption key={group} value={group}>
                      {group}
                    </McOption>
                  ))}
                </McSelect>
              </div>
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Rule Number"
                name="num"
                value={ruleData.num}
                input={handleInputChange}
                placeholder="Enter rule number"
                required
                invalid={!!errors.rule.num}
                invalidmessage={errors.rule.num}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Rule Name"
                name="name"
                value={ruleData.name}
                input={handleInputChange}
                placeholder="Enter rule name"
                required
                invalid={!!errors.rule.name}
                invalidmessage={errors.rule.name}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Description"
                name="desc"
                value={ruleData.desc}
                input={handleInputChange}
                placeholder="Enter rule description"
                multiline
                rows={3}
                required
                invalid={!!errors.rule.desc}
                invalidmessage={errors.rule.desc}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Customer Reference ID"
                name="custRefID"
                value={ruleData.custRefID}
                input={handleInputChange}
                placeholder="Enter customer reference ID"
                required
                invalid={!!errors.rule.custRefID}
                invalidmessage={errors.rule.custRefID}
              />
            </div>
          </div>
        );
      case 'step':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Step Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Step Number"
                    name="stepNo"
                    value={step.stepNo}
                    input={(e) => handleInputChange(e, index)}
                    placeholder={`Enter step number (e.g., ${ruleData.num}.${index + 1})`}
                    required
                    invalid={!!errors.steps[index].stepNo}
                    invalidmessage={errors.steps[index].stepNo}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McSelect
                    label="Step Name"
                    name="stepName"
                    value={step.stepName}
                    optionselected={(e) => handleInputChange(e, index)}
                    required
                    placeholder="Select Step Name"
                    invalid={!!errors.steps[index].stepName}
                    invalidmessage={errors.steps[index].stepName}
                  >
                    <McOption value="Single Step">Single Step</McOption>
                    <McOption value="Multi Step">Multi Step</McOption>
                  </McSelect>
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Step Description"
                    name="StepDesc"
                    value={step.StepDesc}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter step description"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].StepDesc}
                    invalidmessage={errors.steps[index].StepDesc}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McSelect
                    label="Step Type"
                    name="stepType"
                    value={step.stepType}
                    optionselected={(e) => handleInputChange(e, index)}
                    required
                    placeholder="Select a PnL Group"
                    invalid={!!errors.steps[index].stepType}
                    invalidmessage={errors.steps[index].stepType}
                  >
                    <McOption value="S">S</McOption>
                    <McOption value="M">M</McOption>
                  </McSelect>
                </div>
              </div>
            ))}
            <div className={styles.buttonContainer}>
              <McButton
                label="Add Step"
                appearance="secondary"
                click={addStep}
                className={styles.actionButton}
              />
            </div>
          </div>
        );
      case 'preAggregate':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Pre-Aggregate Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Pre-Aggregator Columns"
                    name="preAggregatorColumns"
                    value={step.preAggregatorColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].preAggregatorColumns}
                    invalidmessage={errors.steps[index].preAggregatorColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'source':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Source Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Source Table"
                    name="sourceTable"
                    value={step.sourceTable}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter source table name"
                    required
                    invalid={!!errors.steps[index].sourceTable}
                    invalidmessage={errors.steps[index].sourceTable}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Source Filters"
                    name="sourceFilters"
                    value={step.sourceFilters}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter filters (e.g., PNL_LINE:IN:PnL.DVC.214,PnL.DVC.215;MOVE_TYPE:EQ:EX)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].sourceFilters}
                    invalidmessage={errors.steps[index].sourceFilters}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'join':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Join Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Join Columns"
                    name="joinColumns"
                    value={step.joinColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].joinColumns}
                    invalidmessage={errors.steps[index].joinColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'allocation':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Allocation Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Allocation Columns"
                    name="allocationColumns"
                    value={step.allocationColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].allocationColumns}
                    invalidmessage={errors.steps[index].allocationColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'driver':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Driver Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Table ID"
                    name="driverTableID"
                    value={step.driverTableID}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter driver table ID"
                    required
                    invalid={!!errors.steps[index].driverTableID}
                    invalidmessage={errors.steps[index].driverTableID}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Weight Column"
                    name="driverWeightColumn"
                    value={step.driverWeightColumn}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter driver weight column"
                    required
                    invalid={!!errors.steps[index].driverWeightColumn}
                    invalidmessage={errors.steps[index].driverWeightColumn}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Filters"
                    name="driverFilters"
                    value={step.driverFilters}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter filters (e.g., ALLOC_MOVE:IN:GATE-IN,ON-RAIL;MCHE_SHP:NTEQ:0)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].driverFilters}
                    invalidmessage={errors.steps[index].driverFilters}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      default:
        return <div className={styles.tabContent}>No Tab Selected</div>;
    }
  };

  return (
    <div className={styles.pageWrapper}>
      <div className={styles.container}>
        <div className={styles.card}>
          <div className={styles.buttonContainer}>
            <McButton
              label="Back"
              appearance="neutral"
              click={handleCancel}
              className={styles.actionButton}
            />
            <McButton
              label="Save"
              appearance="primary"
              click={handleSave}
              className={styles.actionButton}
            />
          </div>

          <div className={styles.tabs}>
            <button
              className={`${styles.tabButton} ${activeTab === 'ruleInfo' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('ruleInfo')}
            >
              Rule Info
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'step' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('step')}
            >
              Step
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'preAggregate' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('preAggregate')}
            >
              Pre-Aggregate
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'source' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('source')}
            >
              Source
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'join' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('join')}
            >
              Join
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'allocation' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('allocation')}
            >
              Allocation
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'driver' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('driver')}
            >
              Driver
            </button>
          </div>

          {renderTabContent()}
        </div>
      </div>
    </div>
  );
};

export default CreateRules;

import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { McButton, McInput } from '@maersk-global/mds-react-wrapper';
import { McSelect } from '@maersk-global/mds-react-wrapper/components-core/mc-select';
import { McOption } from '@maersk-global/mds-react-wrapper/components-core/mc-option';
import styles from '../styles/CreateRule.module.css';
import data from '../data/PnLGroup.json';

const CreateRules = () => {
  const navigate = useNavigate();
  const [activeTab, setActiveTab] = useState('ruleInfo');
  const [ruleData, setRuleData] = useState({
    num: '',
    name: '',
    desc: '',
    custRefID: '',
    ruleGroup: '',
    isActive: 'Y',
    pnlGroup: '',
  });
  const [steps, setSteps] = useState([
    {
      stepNo: '',
      stepName: 'Single Step',
      StepDesc: '',
      stepType: 'S',
      preAggregatorColumns: '',
      sourceTable: '',
      sourceFilters: '',
      joinColumns: '',
      allocationColumns: '',
      driverTableID: '',
      driverWeightColumn: '',
      driverFilters: '',
    },
  ]);
  const [errors, setErrors] = useState({ rule: {}, steps: [{}] });

  // Extract PnL Group options from JSON, with fallback for empty data
  const pnlGroups = data.PnLGroups ? Object.keys(data.PnLGroups) : [];

  // Get Rule Group options based on selected PnL Group, with fallback
  const ruleGroups = ruleData.pnlGroup && data.PnLGroups[ruleData.pnlGroup]
    ? data.PnLGroups[ruleData.pnlGroup].RuleGroups || []
    : [];

  const addStep = () => {
    setSteps((prevSteps) => [
      ...prevSteps,
      {
        stepNo: '',
        stepName: '',
        StepDesc: '',
        stepType: '',
        preAggregatorColumns: '',
        sourceTable: '',
        sourceFilters: '',
        joinColumns: '',
        allocationColumns: '',
        driverTableID: '',
        driverWeightColumn: '',
        driverFilters: '',
      },
    ]);
    setErrors((prevErrors) => ({
      ...prevErrors,
      steps: [...prevErrors.steps, {}],
    }));
  };

  const validateForm = () => {
    const newErrors = { rule: {}, steps: steps.map(() => ({})) };
    let isValid = true;

    // Validate rule data (all fields are mandatory)
    Object.keys(ruleData).forEach((key) => {
      if (!ruleData[key]) {
        newErrors.rule[key] = 'This field is required';
        isValid = false;
      }
    });

    // Validate steps (all fields are mandatory)
    steps.forEach((step, index) => {
      const stepErrors = {};
      Object.keys(step).forEach((key) => {
        if (!step[key]) {
          stepErrors[key] = 'This field is required';
          isValid = false;
        }
      });
      newErrors.steps[index] = stepErrors;
    });

    setErrors(newErrors);
    return isValid;
  };

  const handleInputChange = (e, stepIndex = null) => {
    const { name, value } = e.target;
    console.log(`Input changed: ${name} = ${value}${stepIndex !== null ? ` (Step ${stepIndex + 1})` : ''}`);
    
    if (stepIndex !== null) {
      setSteps((prevSteps) => {
        const newSteps = [...prevSteps];
        newSteps[stepIndex] = { ...newSteps[stepIndex], [name]: value };
        return newSteps;
      });
      setErrors((prevErrors) => ({
        ...prevErrors,
        steps: prevErrors.steps.map((stepErrors, i) =>
          i === stepIndex ? { ...stepErrors, [name]: '' } : stepErrors
        ),
      }));
    } else {
      setRuleData((prevData) => ({
        ...prevData,
        [name]: value,
        ...(name === 'pnlGroup' ? { ruleGroup: '' } : {}),
      }));
      setErrors((prevErrors) => ({
        ...prevErrors,
        rule: { ...prevErrors.rule, [name]: '' },
      }));
    }
  };

  const handleSelectChange = (e) => {
    const { name, value } = e.target;
    console.log(`Select changed: ${name} = ${value}`);
    setRuleData((prevData) => ({
      ...prevData,
      [name]: value,
      ...(name === 'pnlGroup' ? { ruleGroup: '' } : {}),
    }));
    setErrors((prevErrors) => ({
      ...prevErrors,
      rule: { ...prevErrors.rule, [name]: '' },
    }));
  };

  const handleSave = async () => {
    if (!validateForm()) {
      console.log('Validation failed:', JSON.stringify(errors, null, 2));
      alert('Please fill out all required fields.');
      return;
    }

    // Parse comma-separated columns and filters
    const parseColumns = (input) => input.split(',').map((item) => item.trim()).filter((item) => item);
    const parseFilters = (input) => {
      const filters = input.split(';').map((item) => item.trim()).filter((item) => item);
      return filters.map((filter) => {
        const [name, filterType, values] = filter.split(':').map((item) => item.trim());
        return { name, filterType, values };
      });
    };

    const ruleJson = {
      rules: {
        rule: [
          {
            num: ruleData.num,
            name: ruleData.name,
            desc: ruleData.desc,
            custRefID: ruleData.custRefID,
            ruleGroup: ruleData.ruleGroup,
            isActive: ruleData.isActive,
            Step: steps.map((step, index) => ({
              stepNo: step.stepNo || `${ruleData.num}.${index + 1}`,
              stepName: step.stepName === 'Single Step' ? 'single' : 'multi',
              StepDesc: step.StepDesc,
              stepType: step.stepType,
              isActive: 'Y',
              SourceTable: {
                id: '1',
                Name: step.sourceTable,
              },
              sourceFilters: {
                columns: parseFilters(step.sourceFilters),
              },
              preAggregator: {
                columns: parseColumns(step.preAggregatorColumns),
              },
              join: {
                columns: parseColumns(step.joinColumns),
              },
              allocation: {
                columns: parseColumns(step.allocationColumns),
              },
              driver: {
                driverTableID: step.driverTableID,
                driverWeightColumn: step.driverWeightColumn,
                driverFilters: {
                  columns: parseFilters(step.driverFilters),
                },
              },
            })),
          },
        ],
      },
    };

    console.log('Saving Rule Data:', JSON.stringify(ruleJson, null, 2));

    try {
      const response = await fetch('/api/rules', {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
          'Accept': 'application/json',
        },
        body: JSON.stringify(ruleJson),
      });

      if (response.ok) {
        console.log('Rule created successfully');
        alert('Rule created successfully!');
        navigate('/');
      } else {
        const errorText = await response.text();
        console.error('Failed to create rule:', response.status, errorText);
        alert(`Failed to create rule: ${errorText || response.statusText}`);
      }
    } catch (error) {
      console.error('Error during API call:', error.message);
      alert('An error occurred while saving the rule. Please try again.');
    }
  };

  const handleCancel = () => {
    console.log('Cancelling rule creation');
    navigate('/');
  };

  const renderTabContent = () => {
    console.log('Rendering tab:', activeTab);
    switch (activeTab) {
      case 'ruleInfo':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Rule Information</h3>
            <div className={styles.formGrid}>
              <div className={styles.gridItem}>
                <McSelect
                  label="PnL Group"
                  name="pnlGroup"
                  value={ruleData.pnlGroup}
                  optionselected={handleSelectChange}
                  placeholder="Select a PnL Group"
                  required
                  invalid={!!errors.rule.pnlGroup}
                  invalidmessage={errors.rule.pnlGroup}
                >
                  {pnlGroups.map((group) => (
                    <McOption key={group} value={group}>
                      {group}
                    </McOption>
                  ))}
                </McSelect>
              </div>
              <div className={styles.gridItem}>
                <McSelect
                  label="Rule Group"
                  name="ruleGroup"
                  value={ruleData.ruleGroup}
                  optionselected={handleSelectChange}
                  placeholder={ruleGroups.length ? "Select a Rule Group" : "Select a PnL Group first"}
                  required
                  disabled={!ruleData.pnlGroup || !ruleGroups.length}
                  invalid={!!errors.rule.ruleGroup}
                  invalidmessage={errors.rule.ruleGroup}
                >
                  {ruleGroups.map((group) => (
                    <McOption key={group} value={group}>
                      {group}
                    </McOption>
                  ))}
                </McSelect>
              </div>
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Rule Number"
                name="num"
                value={ruleData.num}
                input={handleInputChange}
                placeholder="Enter rule number"
                required
                invalid={!!errors.rule.num}
                invalidmessage={errors.rule.num}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Rule Name"
                name="name"
                value={ruleData.name}
                input={handleInputChange}
                placeholder="Enter rule name"
                required
                invalid={!!errors.rule.name}
                invalidmessage={errors.rule.name}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Description"
                name="desc"
                value={ruleData.desc}
                input={handleInputChange}
                placeholder="Enter rule description"
                multiline
                rows={3}
                required
                invalid={!!errors.rule.desc}
                invalidmessage={errors.rule.desc}
              />
            </div>
            <div className={styles.inputGroup}>
              <McInput
                label="Customer Reference ID"
                name="custRefID"
                value={ruleData.custRefID}
                input={handleInputChange}
                placeholder="Enter customer reference ID"
                required
                invalid={!!errors.rule.custRefID}
                invalidmessage={errors.rule.custRefID}
              />
            </div>
            <div className={styles.inputGroup}>
              <McSelect
                label="Is Active"
                name="isActive"
                value={ruleData.isActive}
                optionselected={handleSelectChange}
                required
                invalid={!!errors.rule.isActive}
                invalidmessage={errors.rule.isActive}
              >
                <McOption value="Y">Yes</McOption>
                <McOption value="N">No</McOption>
              </McSelect>
            </div>
          </div>
        );
      case 'step':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Step Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    minutiae
                    label="Step Number"
                    name="stepNo"
                    value={step.stepNo}
                    input={(e) => handleInputChange(e, index)}
                    placeholder={`Enter step number (e.g., ${ruleData.num}.${index + 1})`}
                    required
                    invalid={!!errors.steps[index].stepNo}
                    invalidmessage={errors.steps[index].stepNo}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McSelect
                    label="Step Name"
                    name="stepName"
                    value={step.stepName}
                    optionselected={(e) => handleInputChange(e, index)}
                    required
                    placeholder="Select Step Name"
                    invalid={!!errors.steps[index].stepName}
                    invalidmessage={errors.steps[index].stepName}
                  >
                    <McOption value="Single Step">Single Step</McOption>
                    <McOption value="Multi Step">Multi Step</McOption>
                  </McSelect>
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Step Description"
                    name="StepDesc"
                    value={step.StepDesc}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter step description"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].StepDesc}
                    invalidmessage={errors.steps[index].StepDesc}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McSelect
                    label="Step Type"
                    name="stepType"
                    value={step.stepType}
                    optionselected={(e) => handleInputChange(e, index)}
                    required
                    placeholder="Select Step Type"
                    invalid={!!errors.steps[index].stepType}
                    invalidmessage={errors.steps[index].stepType}
                  >
                    <McOption value="S">S</McOption>
                    <McOption value="M">M</McOption>
                  </McSelect>
                </div>
              </div>
            ))}
            <div className={styles.buttonContainer}>
              <McButton
                label="Add Step"
                appearance="secondary"
                click={addStep}
                className={styles.actionButton}
              />
            </div>
          </div>
        );
      case 'preAggregate':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Pre-Aggregate Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Pre-Aggregator Columns"
                    name="preAggregatorColumns"
                    value={step.preAggregatorColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].preAggregatorColumns}
                    invalidmessage={errors.steps[index].preAggregatorColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'source':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Source Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Source Table"
                    name="sourceTable"
                    value={step.sourceTable}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter source table name"
                    required
                    invalid={!!errors.steps[index].sourceTable}
                    invalidmessage={errors.steps[index].sourceTable}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Source Filters"
                    name="sourceFilters"
                    value={step.sourceFilters}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter filters (e.g., PNL_LINE:IN:PnL.DVC.214,PnL.DVC.215;MOVE_TYPE:EQ:EX)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].sourceFilters}
                    invalidmessage={errors.steps[index].sourceFilters}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'join':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Join Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Join Columns"
                    name="joinColumns"
                    value={step.joinColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].joinColumns}
                    invalidmessage={errors.steps[index].joinColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'allocation':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Allocation Columns</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Allocation Columns"
                    name="allocationColumns"
                    value={step.allocationColumns}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter columns (comma-separated)"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].allocationColumns}
                    invalidmessage={errors.steps[index].allocationColumns}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      case 'driver':
        return (
          <div className={styles.tabContent}>
            <h3 className={styles.sectionTitle}>Driver Information</h3>
            {steps.map((step, index) => (
              <div key={index} className={styles.stepCase}>
                <h4>Step {index + 1}</h4>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Table ID"
                    name="driverTableID"
                    value={step.driverTableID}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter driver table ID"
                    required
                    invalid={!!errors.steps[index].driverTableID}
                    invalidmessage={errors.steps[index].driverTableID}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Weight Column"
                    name="driverWeightColumn"
                    value={step.driverWeightColumn}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter driver weight column"
                    required
                    invalid={!!errors.steps[index].driverWeightColumn}
                    invalidmessage={errors.steps[index].driverWeightColumn}
                  />
                </div>
                <div className={styles.inputGroup}>
                  <McInput
                    label="Driver Filters"
                    name="driverFilters"
                    value={step.driverFilters}
                    input={(e) => handleInputChange(e, index)}
                    placeholder="Enter filters"
                    multiline
                    rows={3}
                    required
                    invalid={!!errors.steps[index].driverFilters}
                    invalidmessage={errors.steps[index].driverFilters}
                  />
                </div>
              </div>
            ))}
          </div>
        );
      default:
        return <div className={styles.tabContent}>No Tab Selected</div>;
    }
  };

  return (
    <div className={styles.pageWrapper}>
      <div className={styles.container}>
        <div className={styles.card}>
          <div className={styles.buttonContainer}>
            <McButton
              label="Back"
              appearance="neutral"
              click={handleCancel}
              className={styles.actionButton}
            />
            <McButton
              label="Save"
              appearance="primary"
              click={handleSave}
              className={styles.actionButton}
            />
          </div>

          <div className={styles.tabs}>
            <button
              className={`${styles.tabButton} ${activeTab === 'ruleInfo' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('ruleInfo')}
            >
              Rule Info
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'step' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('step')}
            >
              Step
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'preAggregate' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('preAggregate')}
            >
              Pre-Aggregate
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'source' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('source')}
            >
              Source
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'join' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('join')}
            >
              Join
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'allocation' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('allocation')}
            >
              Allocation
            </button>
            <button
              className={`${styles.tabButton} ${activeTab === 'driver' ? styles.activeTab : ''}`}
              onClick={() => setActiveTab('driver')}
            >
              Driver
            </button>
          </div>

          {renderTabContent()}
        </div>
      </div>
    </div>
  );
};

export default CreateRules;

Launch your own pro-level crypto exchange with Hivelance’s Coinbase Clone Script integrated with AI-powered trading bots. Built for expert traders, it features advanced order types, real-time analytics, top-tier security, and goes live in just 10 days. Fast, customizable, and ready for the bull market!

🔥 Key Features of Coinbase Clone Script

✅ Smart Trading Bots for 24/7 automated trading
✅ Advanced Order Types – Limit, Stop, Market, and more
✅ Real-Time Price Charts & Analytics
✅ High-Speed Matching Engine
✅ Bank-Grade Security Protocols
✅ KYC/AML Integration for Compliance
✅ Multi-Currency & Wallet Support
✅ Responsive Web & Mobile Interface
✅ 100% Customizable & Bug-Free Script
✅ And More

💡 Ideal for entrepreneurs & crypto startups

📞 Contact us now & dominate the crypto trading market!

Website - https://www.hivelance.com/coinbase-clone-script
Telegram - https://telegram.me/HiveLance
Call/WhatsApp - 918438595928

-- ICA_OddTime_PerCard_PerMID_EDC
CREATE TABLE team_kingkong.offus_ICA_OddTime_PerCard_PerMID_EDC_breaches AS
-- INSERT INTO team_kingkong.offus_ICA_OddTime_PerCard_PerMID_EDC_breaches
with offus_txn as
(SELECT transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, globalcardindex
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type
, merchantcategory, merchantsubcategory, isindian FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , globalcardindex
    , merchantcategory, merchantsubcategory, isindian
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-02-01' - INTERVAL '1' DAY) AND DATE'2025-02-28'
    and paymethod in ('CREDIT_CARD','DEBIT_CARD')
    AND actionrecommended <> 'BLOCK') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid)

SELECT * FROM
    (SELECT A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.globalcardindex, A.mid_type, 'ICA_OddTime_PerCard_PerMID_EDC' AS rule_name, A.txn_timestamp
    , 5000 as per_txn_limit
    , COUNT(B.transactionid) as txn1_day
    , 2 as txn1_day_threshold
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN date '2025-02-01' AND DATE'2025-02-28'
        AND isindian = 'false'
        AND HOUR(FROM_UNIXTIME(txn_timestamp / 1000)) BETWEEN 0 AND 4
        AND (merchantsubcategory NOT IN ('Restaurant', 'Foodcourt','Restaurants and Bars', 'Fast Food and QSR' , 'Hotel', 'Aviation','Tours and Travel Agency' , 'Pharmacy', 'Hospital','Taxi','Pharmacy', 'Hospital', 'Taxi')
        OR merchantcategory NOT IN ('Airport','Gas and Petrol')))A
    LEFT JOIN
        (SELECT * FROM offus_txn)B
    ON A.globalcardindex = B.globalcardindex AND A.paytmmerchantid = B.paytmmerchantid AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 86400000 -- <= 1day
    AND A.transactionid <> B.transactionid
    GROUP BY 1,2,3,4,5,6,7,8)
WHERE (txn_amount > per_txn_limit) OR (txn1_day>= txn1_day_threshold)
-- LIMIT 100
;

-- RECHECK
-- Merchant_PerTxnLimit_Check

-- DROP TABLE team_kingkong.offus_Merchant_PerTxnLimit_Check_breaches;

-- CREATE TABLE team_kingkong.offus_Merchant_PerTxnLimit_Check_breaches AS
INSERT INTO team_kingkong.offus_Merchant_PerTxnLimit_Check_breaches
SELECT transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, paymethod
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type
, C.per_txn_limit
, C.limit_date
FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , paymethod
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-05-01' - INTERVAL '1' DAY) AND DATE'2025-05-31'
    and paymethod in ('UPI')
    AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid
INNER JOIN
    (SELECT content as mid, CAST(comment AS DOUBLE) as per_txn_limit, "timestamp" as limit_date
    FROM team_kingkong.merchant_limit_list)C
ON a.paytmmerchantid = C.mid AND a.txn_date > DATE(FROM_UNIXTIME(CAST(limit_date AS double) / 1000))
WHERE a.txn_amount > C.per_txn_limit;

-- ICA_OddTime_PerCard_PerMID_EDC
DROP TABLE team_kingkong.offus_ICA_OddTime_PerCard_PerMID_EDC_breaches;

-- CREATE TABLE team_kingkong.offus_ICA_OddTime_PerCard_PerMID_EDC_breaches AS
INSERT INTO team_kingkong.offus_ICA_OddTime_PerCard_PerMID_EDC_breaches
with offus_txn as
(SELECT transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, globalcardindex
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type
, merchantcategory, merchantsubcategory, isindian FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , globalcardindex
    , merchantcategory, merchantsubcategory, isindian
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-05-01' - INTERVAL '1' DAY) AND DATE'2025-05-31'
    and paymethod in ('CREDIT_CARD','DEBIT_CARD')
    AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid)

SELECT * FROM
    (SELECT A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.globalcardindex, A.mid_type, 'ICA_OddTime_PerCard_PerMID_EDC' AS rule_name, A.txn_timestamp
    , 5000 as per_txn_limit
    , COUNT(B.transactionid) as txn1_day
    , 2 as txn1_day_threshold
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN date '2025-05-01' AND DATE'2025-05-31'
        AND isindian = 'false'
        AND HOUR(FROM_UNIXTIME(txn_timestamp / 1000)) BETWEEN 0 AND 4
        AND (merchantsubcategory NOT IN ('Restaurant', 'Foodcourt','Restaurants and Bars', 'Fast Food and QSR' , 'Hotel', 'Aviation','Tours and Travel Agency' , 'Pharmacy', 'Hospital','Taxi','Pharmacy', 'Hospital', 'Taxi')
        OR merchantcategory NOT IN ('Airport','Gas and Petrol')))A
    LEFT JOIN
        (SELECT * FROM offus_txn)B
    ON A.globalcardindex = B.globalcardindex AND A.paytmmerchantid = B.paytmmerchantid AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 86400000 -- <= 1day
    AND A.transactionid <> B.transactionid
    GROUP BY 1,2,3,4,5,6,7,8)
WHERE (txn_amount > per_txn_limit) OR (txn1_day>= txn1_day_threshold)
;

-- CCUPI_vpa_mid_hourly_limit
DROP TABLE team_kingkong.offus_CCUPI_vpa_mid_hourly_limit_breaches;

-- CREATE TABLE team_kingkong.offus_CCUPI_vpa_mid_hourly_limit_breaches AS
INSERT INTO team_kingkong.offus_CCUPI_vpa_mid_hourly_limit_breaches
with offus_txn as
(SELECT DISTINCT transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, small_vpa
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type FROM
    (SELECT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , small_vpa
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-05-01' - INTERVAL '1' DAY) AND DATE'2025-05-31'
    AND isupicc = 'true' AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid)

SELECT * FROM
    (SELECT A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.small_vpa, A.mid_type, 'CCUPI_vpa_mid_hourly_limit' AS rule_name, A.txn_timestamp
    , COUNT(B.transactionid) as txn1_hr
    , 3 as txn1_hr_threshold
    , SUM(B.txn_amount) as amt1_hr
    , 2000 as amt1_hr_threshold
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN date '2025-05-01' AND DATE'2025-05-31')A
    INNER JOIN
        (SELECT * FROM offus_txn)B
    ON A.small_vpa = B.small_vpa AND A.paytmmerchantid = B.paytmmerchantid AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 3600000 -- <= 1hour
    AND A.transactionid <> B.transactionid
    GROUP BY 1,2,3,4,5,6,7,8)
WHERE (txn1_hr >= txn1_hr_threshold) AND ((amt1_hr + txn_amount) > amt1_hr_threshold)
;

-- CCUPI_vpa_mid_daily_limit
-- DROP TABLE team_kingkong.offus_CCUPI_vpa_mid_daily_limit_breaches;

-- CREATE TABLE team_kingkong.offus_CCUPI_vpa_mid_daily_limit_breaches AS
INSERT INTO team_kingkong.offus_CCUPI_vpa_mid_daily_limit_breaches
with offus_txn as
(SELECT transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, small_vpa
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (
    select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , small_vpa
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-05-01' - INTERVAL '1' DAY) AND DATE'2025-05-31'
    -- and paymethod in ('CREDIT_CARD','DEBIT_CARD','EMI','EMI_DC')
    AND isupicc = 'true' AND actionrecommended <> 'BLOCK') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid)

SELECT * FROM
    (SELECT A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.small_vpa, A.mid_type, 'CCUPI_vpa_mid_daily_limit' AS rule_name, A.txn_timestamp
    , COUNT(B.transactionid) as txn1_day
    , 5 as txn1_day_threshold
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN date '2025-05-01' AND DATE'2025-05-31'
        AND txn_amount <= 2000)A
    INNER JOIN
        (SELECT * FROM offus_txn)B
    ON A.small_vpa = B.small_vpa AND A.paytmmerchantid = B.paytmmerchantid AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 3600000 -- <= 1hour
    AND A.transactionid <> B.transactionid
    GROUP BY 1,2,3,4,5,6,7,8)
WHERE txn1_day >= txn1_day_threshold
;

{
	"blocks": [
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":aboriginal_flag: Xero Boost Days - What's On :aboriginal_flag:"
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Good Morning Meanjin, and welcome to Reconciliation Week!\n\n *Reconciliation Week (27 May – 3 June)* is a time for all Australians to learn about our shared histories, cultures, and achievements, and to explore how we can contribute to reconciliation in Australia. \n\n For Aboriginal and Torres Strait Islander peoples, it’s a powerful reminder of ongoing resilience, the importance of truth-telling, and the work still needed to achieve genuine equity and justice."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-3: Monday, 26th May",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "\n:coffee: *Café Partnership*: Enjoy free coffee and café-style beverages from our Cafe partner *Edwards*.\n:Lunch: *Lunch*: from *12pm* in the kitchen.\n:massage:*Wellbeing*: Pilates at *SP Brisbane City* is bookable every Monday!"
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-28: Wednesday, 28th May",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": ":coffee: *Café Partnership*: Enjoy free coffee and café-style beverages from our Cafe partner *Edwards*.\n:lunch: *Reconciliation Week Morning Tea* provided by <https://jarrahcatering.com.au/|Jarrah Catering> from *9:30am* in the kitchen! \n\n :microphone: We will also have a video of our very own *Tony Davison* talking on behalf of the #reconciliation-au ERG around Xero's Reconciliation plan and what this week means! \n\n :slack: In the thread we will also have a special background for you to use on Google Meet if you would like to participate."
			}
		},
		{
			"type": "header",
			"text": {
				"type": "plain_text",
				"text": ":calendar-date-30: Friday, 30th May",
				"emoji": true
			}
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": ":cheers-9743: *Social Happy Hour* from 3pm - 4pm in the kitchen! Wind down for the week over some delicious drinks & nibbles."
			}
		},
		{
			"type": "divider"
		},
		{
			"type": "section",
			"text": {
				"type": "mrkdwn",
				"text": "Stay tuned to this channel for more details, check out the <https://calendar.google.com/calendar/u/0?cid=Y19uY2M4cDN1NDRsdTdhczE0MDhvYjZhNnRjb0Bncm91cC5jYWxlbmRhci5nb29nbGUuY29t|*Brisbane Social Calendar*>, and get ready to Boost your workdays!\n\nLove,\nWX Team :party-wx:"
			}
		}
	]
}

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

if ( !function_exists( 'chld_thm_cfg_locale_css' ) ):
    function chld_thm_cfg_locale_css( $uri ){
        if ( empty( $uri ) && is_rtl() && file_exists( get_template_directory() . '/rtl.css' ) )
            $uri = get_template_directory_uri() . '/rtl.css';
        return $uri;
    }
endif;
add_filter( 'locale_stylesheet_uri', 'chld_thm_cfg_locale_css' );
         
if ( !function_exists( 'child_theme_configurator_css' ) ):
    function child_theme_configurator_css() {
        wp_enqueue_style( 'chld_thm_cfg_child', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css', array( 'hello-elementor','hello-elementor','hello-elementor-theme-style','hello-elementor-header-footer' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'child_theme_configurator_css', 10 );

// END ENQUEUE PARENT ACTION



/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.3.0.1744009168
Updated: 2025-04-07 06:59:28

*/

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

if ( !function_exists( 'chld_thm_cfg_locale_css' ) ):
    function chld_thm_cfg_locale_css( $uri ){
        if ( empty( $uri ) && is_rtl() && file_exists( get_template_directory() . '/rtl.css' ) )
            $uri = get_template_directory_uri() . '/rtl.css';
        return $uri;
    }
endif;
add_filter( 'locale_stylesheet_uri', 'chld_thm_cfg_locale_css' );
         
if ( !function_exists( 'child_theme_configurator_css' ) ):
    function child_theme_configurator_css() {
        wp_enqueue_style( 'chld_thm_cfg_child', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css', array( 'hello-elementor','hello-elementor','hello-elementor-theme-style','hello-elementor-header-footer' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'child_theme_configurator_css', 10 );

// END ENQUEUE PARENT ACTION



/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.3.0.1744009168
Updated: 2025-04-07 06:59:28

*/

-- MONTHLY BREACH COUNT
-- team_kingkong.offus_MID_CCDC_Daily_TXN_limit_Check_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_MID_CCDC_Daily_TXN_limit_Check_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_edc_card_velocity_count_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_edc_card_velocity_count_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_Merchant_PerTxnLimit_Check_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
-- , COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_Merchant_PerTxnLimit_Check_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_edc_card_velocity_amount_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_edc_card_velocity_amount_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_oil_gas_dc_limit_EDC_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_oil_gas_dc_limit_EDC_breaches)
GROUP BY 1 ORDER BY 1;

-- team_kingkong.offus_ICA_Unsafe_Country_Transactions_breaches
SELECT substr(cast(txn_date as varchar(30)), 1, 7) as year_month
, COUNT(transactionid) AS breach_cnt
, SUM(txn_amount) as breach_amt
, COUNT(DISTINCT globalcardindex) as card_cnt
FROM
(SELECT DISTINCT *
FROM team_kingkong.offus_ICA_Unsafe_Country_Transactions_breaches)
GROUP BY 1 ORDER BY 1;

-- RECHCECKING
-- OFFUS : edc_card_velocity_amount
-- edc_card_velocity_amount 

-- DROP TABLE IF EXISTS team_kingkong.offus_edc_card_velocity_amount_breaches2;
-- DROP TABLE IF EXISTS team_kingkong.offus_edc_card_velocity_amount_breaches;

-- CREATE TABLE team_kingkong.offus_edc_card_velocity_amount_breaches AS
INSERT INTO team_kingkong.offus_edc_card_velocity_amount_breaches
with offus_txn as
(SELECT DISTINCT globalcardindex, transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN date'2025-05-01' AND DATE'2025-05-31'
    and paymethod in ('CREDIT_CARD','DEBIT_CARD','EMI','EMI_DC')
    AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS'
    AND paytmmerchantid IS NOT NULL AND paytmmerchantid <> '' AND paytmmerchantid <> ' '
    AND globalcardindex IS NOT NULL AND globalcardindex <> '' AND globalcardindex <> ' ') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b 
ON a.paytmmerchantid = b.edc_mid)

SELECT * FROM 
    (SELECT A.globalcardindex, A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, 'edc_card_velocity_amount' AS rule_name, A.txn_timestamp
    , SUM(IF((A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 21600000, B.txn_amount, NULL)) AS amt6_hr
    , 1000000 AS amt6_hr_threshold
    , SUM(B.txn_amount) as amt24_hr
    , 2000000 AS amt4_hr_threshold
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date  BETWEEN date'2025-05-01' AND DATE'2025-05-31')A
    INNER JOIN
        (SELECT * FROM offus_txn)B
    ON A.globalcardindex = b.globalcardindex AND A.paytmmerchantid = B.paytmmerchantid AND A.transactionid <> B.transactionid
    AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 86400000 -- <= 1d
    GROUP BY 1,2,3,4,5,6,7)
WHERE ((amt6_hr + txn_amount) > 1000000) OR ((amt24_hr + txn_amount) > 2000000);

DROP TABLE team_kingkong.offus_ICA_Unsafe_Country_Transactions_breaches;

-- CREATE TABLE team_kingkong.offus_ICA_Unsafe_Country_Transactions_breaches AS
INSERT INTO team_kingkong.offus_ICA_Unsafe_Country_Transactions_breaches
SELECT globalcardindex, transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, paymethod
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type, bankcountry, small_vpa, country_bl_date FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid, bankcountry, small_vpa
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , paymethod
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-01-01' - INTERVAL '1' DAY) AND DATE'2025-05-31'
    AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS'
    AND isindian = 'false' AND bankcountry IS NOT NULL) a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid
INNER JOIN
    (SELECT content as country, "timestamp" AS country_bl_date
    FROM team_kingkong.high_risk_country_list
    WHERE DATE(FROM_UNIXTIME(CAST("timestamp" AS double) / 1000)) <= DATE'2025-05-31')C
ON a.bankcountry = C.country AND DATE(FROM_UNIXTIME(CAST(country_bl_date AS double) / 1000)) < a.txn_date;

@media (max-width: 480px){
	.campaign-zone .wrapper {
    padding-top: 0px;
}

.campaign-zone{
	width: 100%;
	padding-top: 0px;
}

.wrapper{
	padding: 0px;
}
}

-- DROP TABLE team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches;

-- CREATE TABLE team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches AS
INSERT INTO team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches
with offus_txn as
(SELECT globalcardindex, transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, paymethod
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type
, 5 AS threshold_5min
, 40 AS threshold_1day
FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , paymethod
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-01-01' - INTERVAL '1' DAY) AND DATE'2025-01-31' -- BETWEEN date'2025-01-31' AND
    and paymethod in ('UPI')
    AND actionrecommended <> 'BLOCK') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid
INNER JOIN
    (select distinct txn_id as pg_txn_id
    from dwh.pg_olap
    where ingest_date BETWEEN DATE'2025-01-01' AND DATE(DATE'2025-01-31' + INTERVAL '1' DAY)
    and txn_started_at BETWEEN  DATE'2025-01-01' AND DATE(DATE'2025-01-31' + INTERVAL '1' DAY)
    and txn_status = 'SUCCESS') d
on a.transactionid = d.pg_txn_id)

SELECT * FROM
    (SELECT a.globalcardindex, A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.txn_timestamp
    , A.mid_type, A.paymethod
    , A.threshold_5min
    , A.threshold_1day
    , COUNT(IF((A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 300000, B.transactionid, NULL)) AS txn5_min
    , COUNT(B.transactionid) as txn1_day
    , 'MID_UPI_Daily_TXN_limit_Check' AS rule_name
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN DATE'2025-01-01' AND  DATE'2025-01-31')A
    INNER JOIN
        (SELECT * FROM offus_txn)B
    ON A.globalcardindex = b.globalcardindex AND A.paytmmerchantid = B.paytmmerchantid
    AND A.transactionid <> B.transactionid
    AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 86400000 -- <= 1d
    GROUP BY 1,2,3,4,5,6,7,8,9,10)
WHERE (txn5_min >= threshold_5min) OR (txn1_day >= threshold_1day);

-- DROP TABLE team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches;

-- CREATE TABLE team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches AS
INSERT INTO team_kingkong.offus_MID_UPI_Daily_TXN_limit_Check_breaches
with offus_txn as
(SELECT globalcardindex, transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, paymethod
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type
, 5 AS threshold_5min
, 40 AS threshold_1day
FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , paymethod
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-01-01' - INTERVAL '1' DAY) AND DATE'2025-01-31' -- BETWEEN date'2025-01-31' AND
    and paymethod in ('UPI')
    AND actionrecommended <> 'BLOCK') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid
INNER JOIN
    (select distinct txn_id as pg_txn_id
    from dwh.pg_olap
    where ingest_date BETWEEN DATE'2025-01-01' AND DATE(DATE'2025-01-31' + INTERVAL '1' DAY)
    and txn_started_at BETWEEN  DATE'2025-01-01' AND DATE(DATE'2025-01-31' + INTERVAL '1' DAY)
    and txn_status = 'SUCCESS') d
on a.transactionid = d.pg_txn_id)

SELECT * FROM
    (SELECT a.globalcardindex, A.transactionid, A.txn_amount, A.txn_date, A.paytmmerchantid, A.txn_timestamp
    , A.mid_type, A.paymethod
    , A.threshold_5min
    , A.threshold_1day
    , COUNT(IF((A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 300000, B.transactionid, NULL)) AS txn5_min
    , COUNT(B.transactionid) as txn1_day
    , 'MID_UPI_Daily_TXN_limit_Check' AS rule_name
    FROM
        (SELECT * FROM offus_txn
        WHERE txn_date BETWEEN DATE'2025-01-01' AND  DATE'2025-01-31')A
    INNER JOIN
        (SELECT * FROM offus_txn)B
    ON A.globalcardindex = b.globalcardindex AND A.paytmmerchantid = B.paytmmerchantid
    AND A.transactionid <> B.transactionid
    AND (A.txn_timestamp - B.txn_timestamp) BETWEEN 0 AND 86400000 -- <= 1d
    GROUP BY 1,2,3,4,5,6,7,8,9,10)
WHERE (txn5_min >= threshold_5min) OR (txn1_day >= threshold_1day);

// You are using GCC
#include<bits/stdc++.h>
using namespace std;
int main(){
    int n;
    cin>>n;
    int arr[n];
    for(int i=0;i<n;i++){
        cin>>arr[i];
    }
    cout<<"sorted array after selection sort:";
    for(int i=0;i<n;i++){
        int index=i;
        for(int j=i+1;j<n;j++){
            if(arr[j]<arr[index] || arr[j]==arr[index]){
                index=j;
            }
        }
        swap(arr[i],arr[index]);
        cout<<arr[i]<<" ";
    }
    return 0;
}

// You are using GCC
#include<bits/stdc++.h>
using namespace std;
int main(){
    int n;
    cin>>n;
    int arr[n];
    for(int i=0;i<n;i++){
        cin>>arr[i];
    }
    for(int i=0;i<n;i++){
        int min=arr[i];
        int j=i-1;
        while(j>=0 && arr[j]>min){
            arr[j+1]=arr[j];
            j--;
        }
        arr[j+1]=min;
        // cout<<"iretation "<<i+1<<":";
        // for(int k=0;k<n;k++){
        //     cout<<arr[k]<<" ";
        // }
        // cout<<endl;
    }
    cout<<"after sorted using insertion sort:"<<endl;
    for(int i=0;i<n;i++){
        cout<<arr[i]<<" ";
    }
    
    return 0;
}

// You are using GCC
#include<bits/stdc++.h>
using namespace std;
int main(){
    int n;
    cin>>n;
    int arr[n];
    for(int i=0;i<n;i++){
        cin>>arr[i];
    }
    cout<<"after sorted using bubble sort: ";
    for(int i=0;i<n-1;i++){
        for(int j=0;j<n-i-1;j++){
            if(arr[j]>arr[j+1]){
                swap(arr[j],arr[j+1]);
            //   int temp=arr[j];
            //   arr[j]=arr[j+1];
            //   arr[j+1]=temp;
            }
        }
    }
        for(int i=0;i<n;i++){
        cout<<arr[i]<<" ";
        }
    }

/*Tabs > Titles: Remove all caps, increase font size and reduce letter spacing.*/
.blocks-tabs__header-item{
  text-transform: none;
  font-size: 1.5rem;
  letter-spacing: .04rem;
}

/*Quote carousel > Progression circles and arrows: Change arrow hover colour, change progression cirle hover opacity and scale.*/
.block-quote--carousel .carousel-controls-next,
.block-quote--carousel .carousel-controls-prev {
  transition: color 0.3s;
}
.block-quote--carousel .carousel-controls-next:hover,
.block-quote--carousel .carousel-controls-prev:hover {
  color: var(--custom-carousel-prev-next-hover-colour); 
}
.carousel-controls-item-btn {
  transition: all 0.15s ease-in-out;
}
.carousel-controls-item-btn:hover {
  opacity: var(--custom-theme-colour-button-hover-opacity);
  color: var(--custom-theme-hover-bg, #202d60);
}

function allow_custom_font_uploads($mimes) {
    $mimes['woff'] = 'font/woff';
    $mimes['woff2'] = 'font/woff2';
    return $mimes;
}
add_filter('upload_mimes', 'allow_custom_font_uploads');
 
ADD THIS IN FUNCTION.PHP

THEN DOWNLOAD PLUGIN : WP Add Mime Types

THEN ADD : woff = font/woff
woff2 = font/woff2

// creates duplicate list in ascending order
List<WindRosePlotDataRecord> SortedList = _Rows.OrderByDescending(o => o.Parameter).ToList(); 

// creates duplicate list in descending order
List<WindRosePlotDataRecord> SortedList = _Rows.OrderByDescending(o => o.Parameter).ToList(); 
            
// sort-in-place in ascending order
_Rows.Sort((x, y) => x.Parameter.CompareTo(y.Parameter));  

// sort-in-place in descending order
_Rows.Sort((x, y) => y.Parameter.CompareTo(x.Parameter));  // we switched x and y in CompareTo

min-height:19px;
display:flex;
flex-direction:column;
justify-content:center;
line-height:1.2;
background-size:19px;

-- oil_gas_dc_limit_EDC
-- CREATE TABLE team_kingkong.offus_oil_gas_dc_limit_EDC_breaches AS
INSERT INTO team_kingkong.offus_oil_gas_dc_limit_EDC_breaches
SELECT globalcardindex, transactionid, txn_amount, txn_date, paytmmerchantid, txn_timestamp, paymethod
, case when edc_mid is not null then 'EDC' else 'QR' end as mid_type FROM
    (SELECT DISTINCT pg_mid from cdo.total_offline_merchant_base_snapshot_v3) f
INNER join
    (select distinct transactionid
    , cast(eventamount as double)/100 as txn_amount
    , paytmmerchantid
    , globalcardindex
    , DATE(dl_last_updated) AS txn_date
    , CAST(velocitytimestamp AS DOUBLE) AS txn_timestamp
    , paymethod
    from cdp_risk_transform.maquette_flattened_offus_snapshot_v3
    where dl_last_updated BETWEEN DATE(DATE'2025-05-01' - INTERVAL '1' DAY) AND DATE'2025-05-31' -- BETWEEN date'2025-03-31' AND
    and paymethod in ('DEBIT_CARD')
    AND merchantcategory = 'Gas and Petrol' 
    AND cast(eventamount as double)/100 > 125000
    AND actionrecommended <> 'BLOCK' AND responsestatus = 'SUCCESS') a
on a.paytmmerchantid = f.pg_mid
LEFT JOIN
    (SELECT DISTINCT mid AS edc_mid FROM paytmpgdb.entity_edc_info_snapshot_v3
    WHERE terminal_status = 'ACTIVE' AND dl_last_updated >= DATE '2010-01-01') b
ON a.paytmmerchantid = b.edc_mid;

-- TPAP: RISK200
-- DROP TABLE team_kingkong.tpap_risk200_breaches;

-- CREATE TABLE team_kingkong.tpap_risk200_breaches AS
INSERT INTO team_kingkong.tpap_risk200_breaches
with temp_tpap_base as
(SELECT DISTINCT bt.txn_id,
bt.scope_cust_id,
bt.payer_vpa,
bt.payee_vpa,
bt.txn_date,
bt.txn_amount,
st.category,
COALESCE(rd.upi_subtype, CASE WHEN st.category = 'LITE_MANDATE' THEN 'UPI_LITE_MANDATE' ELSE '' END) AS upi_subtype
FROM
    (SELECT txn_id,
    scope_cust_id,
    MAX(CASE WHEN participant_type = 'PAYER' THEN vpa END) AS payer_vpa,
    MAX(CASE WHEN participant_type = 'PAYEE' THEN vpa END) AS payee_vpa,
    MAX(created_on) AS txn_date,
    MAX(amount) AS txn_amount
    FROM switch.txn_participants_snapshot_v3
    WHERE DATE(dl_last_updated) BETWEEN DATE '2025-01-01' AND DATE '2025-01-31'
    AND DATE(created_on) BETWEEN DATE '2025-01-01' AND DATE '2025-01-31'
    GROUP BY txn_id, scope_cust_id) bt
INNER JOIN
    (SELECT txn_id, category
    FROM switch.txn_info_snapshot_v3
    WHERE DATE(dl_last_updated) BETWEEN DATE '2025-01-01' AND DATE '2025-01-31'
    AND DATE(created_on) BETWEEN DATE '2025-01-01' AND DATE '2025-01-31'
    AND UPPER(status) = 'SUCCESS') st
ON bt.txn_id = st.txn_id
INNER JOIN (
    SELECT DISTINCT txnid,
    REGEXP_REPLACE(CAST(json_extract(request, '$.evaluationType') AS varchar), '"', '') AS upi_subtype
    FROM tpap_hss.upi_switchv2_dwh_risk_data_snapshot_v3
    WHERE DATE(dl_last_updated) BETWEEN DATE '2025-01-01' AND DATE '2025-01-31'
    AND (LOWER(REGEXP_REPLACE(CAST(json_extract(request, '$.requestPayload.payerVpa') AS varchar), '"', '')) LIKE '%@paytm%'
    OR LOWER(REGEXP_REPLACE(CAST(json_extract(request, '$.requestPayload.payerVpa') AS varchar), '"', '')) LIKE '%@pt%')
    AND json_extract_scalar(response, '$.action_recommended') <> 'BLOCK') rd
ON bt.txn_id = rd.txnid
WHERE (payer_vpa LIKE '%@paytm%') OR (payer_vpa LIKE '%@pt%')),

temp_blacklist AS
    (SELECT vpa AS blacklisted_vpa,
    DATE(FROM_UNIXTIME(CAST("timestamp" AS double) / 1000)) AS blacklist_date
    FROM team_kingkong.upi_blacklist_vpa_shivam
    WHERE "timestamp" IS NOT NULL
    AND "timestamp" <> ''
    AND DATE(FROM_UNIXTIME(CAST("timestamp" AS double) / 1000)) <= DATE '2025-01-31')

SELECT * FROM  
  (SELECT tb.txn_id,
  tb.scope_cust_id,
  tb.payer_vpa,
  tb.payee_vpa,
  tb.txn_date,
  tb.txn_amount,
  tb.category,
  tb.upi_subtype,
  COALESCE(pv.blacklisted_vpa, rv.blacklisted_vpa) AS blacklisted_vpa,
  COALESCE(pv.blacklist_date, rv.blacklist_date) AS blacklist_date,
  'RISK200' AS risk_code,
  'upi_blacklisted_vpa' AS rule_name
FROM temp_tpap_base tb
LEFT JOIN temp_blacklist pv
  ON tb.payer_vpa = pv.blacklisted_vpa AND tb.txn_date > pv.blacklist_date
LEFT JOIN temp_blacklist rv
  ON tb.payee_vpa = rv.blacklisted_vpa AND tb.txn_date > rv.blacklist_date)
WHERE blacklisted_vpa IS NOT NULL AND blacklist_date < DATE(txn_date);

-- DROP TABLE team_kingkong.tpap_risk307_breaches;

-- CREATE TABLE team_kingkong.tpap_risk307_breaches AS
INSERT INTO team_kingkong.tpap_risk307_breaches
with tpap_base as
(
SELECT B.*, C.category
, IF(D.upi_subtype IS NOT NULL, D.upi_subtype, IF(C.category = 'LITE_MANDATE', 'UPI_LITE_MANDATE', '')) AS upi_subtype
FROM
    (SELECT txn_id, scope_cust_id,
    MAX(CASE WHEN participant_type = 'PAYER' THEN vpa END) AS payer_vpa,
    MAX(CASE WHEN participant_type = 'PAYEE' THEN vpa END) AS payee_vpa,
    MAX(created_on) as txn_date,
    MAX(amount) AS txn_amount,
    created_on AS txn_time
    FROM switch.txn_participants_snapshot_v3
    WHERE DATE(dl_last_updated) BETWEEN DATE'2025-01-01' AND DATE'2025-01-31'
    AND DATE(created_on) BETWEEN DATE'2025-01-01' AND DATE'2025-01-31'
    AND vpa IS NOT NULL
    GROUP BY 1,2,7)B
inner join
    (select txn_id, category
    from switch.txn_info_snapshot_v3
    where DATE(dl_last_updated) BETWEEN DATE'2025-01-01' AND DATE'2025-01-31'
    and DATE(created_on) BETWEEN DATE'2025-01-01' AND DATE'2025-01-31'
    and upper(status) in ('SUCCESS')
    AND category = 'VPA2MERCHANT') C
on B.txn_id = C.txn_id
LEFT JOIN
    (SELECT DISTINCT txnid
    , regexp_replace(cast(json_extract(request, '$.evaluationType') as varchar), '"', '') AS upi_subtype
    FROM tpap_hss.upi_switchv2_dwh_risk_data_snapshot_v3
    WHERE DATE(dl_last_updated) BETWEEN date'2025-01-01' AND DATE'2025-01-31'
    AND (lower(regexp_replace(cast(json_extract(request, '$.requestPayload.payerVpa') as varchar), '"', '')) LIKE '%@paytm%'
    or lower(regexp_replace(cast(json_extract(request, '$.requestPayload.payerVpa') as varchar), '"', '')) like '%@pt%')
    AND json_extract_scalar(response, '$.action_recommended') <> 'BLOCK')D
ON B.txn_id = D.txnid
WHERE (payer_vpa LIKE '%@paytm%') OR (payer_vpa LIKE '%@pt%') -- OR (payee_vpa LIKE '%@pt%') OR (payee_vpa LIKE '%@paytm%')
AND payee_vpa LIKE '%@%' AND payee_vpa <> ''
)

SELECT * FROM
    (SELECT t1.payer_vpa,
      t1.payee_vpa,
      t1.txn_id,
      t1.txn_amount,
      t1.txn_time,
      t1.category,
      t1.upi_subtype,
      COUNT(t2.txn_id) AS prior_txns_last_24h,
      10 as threshold
    FROM tpap_base t1
    INNER JOIN tpap_base t2
      ON t1.payer_vpa = t2.payer_vpa
      AND t1.payee_vpa = t2.payee_vpa
      AND t2.txn_time BETWEEN (t1.txn_time - INTERVAL '24' HOUR) AND t1.txn_time
      AND t2.txn_amount > 1000
    GROUP BY t1.payer_vpa, t1.payee_vpa, t1.txn_id, t1.txn_amount, t1.txn_time, t1.category, t1.upi_subtype)
WHERE prior_txns_last_24h > threshold;

https://www.iperiusremote.com/

It is now crucial to register with the Virtual Assets Regulatory Authority (VARA) if you plan to start a cryptocurrency business in Dubai.. VARA registration ensures compliance with local laws, offering clear guidelines for businesses dealing in virtual assets. Without this registration, companies cannot legally operate within the emirate. Dubai’s focus on regulated crypto activity makes VARA registration a crucial step for businesses aiming to operate transparently and legally. Ensure your business meets the latest requirements by securing your VARA approval before beginning operations.
Beleaf Technologies is the only company offering complete VARA registration services, guiding crypto businesses in Dubai through every step to meet regulatory requirements and operate legally in the region.
Contact for free demo: https://www.beleaftechnologies.com/vara-registration
Whatsapp: +91 7904323274
Telegram: @BeleafSoftTech
Mail to: mailto:business@beleaftechnologies.com

HJBNBHEJNMFHEA