

/* ================= BASE ================= */
body{
margin:0;
font-family:Arial, Helvetica, sans-serif;
background:#f4f4f4;
}

/* ================= HEADER ================= */
header{
position:sticky;
top:0;
z-index:1000;
background:#111;
}

.navbar{
display:flex;
justify-content:space-between;
align-items:center;
padding:0 20px;
}

.logo img{
height:40px;
pointer-events:none;
}

/* ================= MENU ================= */
.menu{
display:flex;
list-style:none;
margin:0;
padding:0;
}

.menu li{
position:relative;
}

.menu a{
display:block;
padding:16px 18px;
text-decoration:none;
color:white;
font-size:16px;
}

.menu a:hover{
background:#2e7d32;
}

/* DROPDOWN */
.dropdown{
display:none;
position:absolute;
top:100%;
left:0;
background:#333;
min-width:220px;
flex-direction:column;
z-index:9999;
}

.dropdown a{
padding:12px 16px;
border-bottom:1px solid #444;
}

.dropdown a:hover{
background:#070DBD;
}

.menu li:hover .dropdown{
display:flex;
}


/* ================= MENU SCROLL================ */
@media screen and (min-width: 769px) {

.dropdown {
    height: auto !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

}

/* ================= HAMBURGER ================= */
.hamburger{
display:none;
font-size:26px;
color:blue;
cursor:pointer;
z-index:100001;
}

/* ================= MOBILE ================= */
@media (max-width:900px){

.hamburger{
display:block;
position:fixed;
top:15px;
right:20px;
}

.menu{
position:fixed;
top:70px;
left:0;
width:100%;
max-height:calc(100vh - 70px);
overflow-y:auto;
background:rgba(0,0,0,0.95);
padding:20px 0;
display:none;
flex-direction:column;
z-index:99999;
}

.menu.active{
display:flex;
}

.dropdown{
position:relative;
background:#222;
}

body.menu-open{
overflow:hidden;
height:100vh;
}
}

/* ================= TABLE ================= */
.custom-table-container { width:100%; }

.custom-table {
width:100%;
border-collapse:collapse;
background:rgba(255,255,255,0.55);
border-radius:12px;
overflow:hidden;
backdrop-filter:blur(4px);
}

.custom-table td {
padding:18px;
font-size:16px;
border-bottom:1px solid rgba(0,0,0,0.15);
transition:0.25s ease;
}

.custom-table tr:last-child td { border-bottom:none; }

.custom-table tr:hover td {
background:rgba(237,244,252);
}

/* MOBILE TABLE */
@media (max-width:768px){
.custom-table td{
padding:14px;
font-size:15px;
}
}

/* ================= LARGE TEXT ================= */
.large-text p,
.large-text small,
.large-text h1,
.large-text h2,
.large-text a{
font-size:3em !important;
}

.large-text .access-btn{
font-size:12px !important;
padding:5px 9px !important;
}

.large-text .text-icon,
.large-text .voice-icon{
font-size:20px !important;
}

/* ================= ARC BUTTON (FIXED + STABLE) ================= */
.quick-menu {
position: fixed;
left: 20px;
bottom: 20px;
z-index: 99999;
}

/* MAIN BUTTON */
.quick-main {
background: #006600;
color: #fff;
padding: 12px;
border-radius: 50%;
cursor: pointer;
font-size: 16px;
text-align: center;
animation: arcPulse 1.8s infinite;
}

@keyframes arcPulse {
0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(0,102,0,0.6); }
70% { transform: scale(1.08); box-shadow: 0 0 0 10px rgba(0,102,0,0); }
100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(0,102,0,0); }
}

/* QUICK LINKS */
.quick-item {
position: absolute;
left: 0;
background: #000;
color: #fff;
padding: 9px 12px;
border-radius: 25px;
text-decoration: none;
white-space: nowrap;

/* HIDDEN STATE */
opacity: 0;
transform: translateY(20px);
pointer-events: none; /* 🔥 PREVENT GHOST CLICKS */

transition: all 0.3s ease;
}

/* ACTIVE STATE */
.quick-menu.open .quick-item {
opacity: 1;
transform: translateY(0);
pointer-events: auto; /* 🔥 ENABLE ONLY WHEN OPEN */
}

/* POSITIONS */
.item1 { bottom: 55px; }
.item2 { bottom: 100px; }
.item3 { bottom: 145px; }
.item4 { bottom: 190px; }
.item5 { bottom: 235px; }

.quick-item:hover {
background: #006600;
}

/* ================= DESKTOP MEGA MENU FIX ================= */

@media screen and (min-width:769px){

.menu li:hover .dropdown{
display:flex !important;
flex-direction:column;
}

.dropdown{
height:auto !important;
max-height:80vh !important;
overflow-y:auto !important;
overflow-x:hidden !important;
}

}