/* Hide the top banner */
        .goog-logo-link,
        .goog-te-gadget span,
        .goog-te-gadget .goog-te-gadget-icon,
        .goog-te-banner-frame,
        #goog-gt-tt,
        .goog-te-balloon-frame,
        .skiptranslate iframe {
            display: none !important;
        }

        body {
            top: 0 !important;
        }

        .dropdown {
            position: relative;
            display: inline-block;
        }

        .dropbtn {
            background: #2563eb;
            color: #fff;
            padding: 10px 16px;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            font-size: 14px;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background: #fff;
            min-width: 140px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
            border-radius: 6px;
            z-index: 9999;
        }

        .dropdown-content a {
            color: #333;
            padding: 8px 12px;
            text-decoration: none;
            display: block;
            font-size: 14px;
        }

        .dropdown-content a:hover {
            background: #f0f0f0;
        }

        .dropdown.show .dropdown-content {
            display: block;
        }

        body {
            top: 0px !important;
        }

        /* Hide Google branding/watermark */
        .goog-logo-link,
        .goog-te-gadget span,
        .goog-te-gadget-simple img {
            display: none !important;
        }

        /* Style only the dropdown */
        #google_translate_element {
            margin: 10px;
        }

        select {
            padding: 6px;
            border-radius: 6px;
            border: 1px solid #ccc;
        }

        @font-face {
            font-family: 'classico_urwbold';
            src: url('urw_type_foundry_-_classico_pro_bold-webfont.woff2') format('woff2'), url('urw_type_foundry_-_classico_pro_bold-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }

        .btn-dark {
            background-color: #c0172a;
            color: #ffffff !important;
        }

        .btn-dark:hover {
            background-color: #c0172a;
            color: #ffffff !important;
        }

        .btn-warning {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-warning:hover {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-secondary {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-secondary:hover {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-success {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-success:hover {
            background-color: #c7a054;
            color: #ffffff !important;
        }

        .btn-link {
            color: #ffffff !important;
        }

        /* div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
                background-color: #000000!important;
            } */
        .otp-container {
            display: flex;
            justify-content: center;
            gap: 10px;
        }

        .otp-input {
            width: 40px;
            height: 40px;
            text-align: center;
            font-size: 20px;
            border: 2px solid #ccc;
            border-radius: 5px;
        }

        #resendOtp,
        #changeNumberSection {
            display: none;
        }

        .btn3d {
            position: relative;
            top: -6px;
            border: 0;
            transition: all 40ms linear;
            margin-top: 10px;
            margin-bottom: 10px;
            margin-left: 2px;
            margin-right: 2px;
        }


        #captcha_code {
            width: 100%;
            max-width: 300px;
            padding: 10px 15px;
            font-size: 16px;
            font-family: Arial, sans-serif;
            color: #333;
            border: 1px solid #ccc;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
            outline: none;
            transition: border-color 0.3s ease, box-shadow 0.3s ease;
        }

        #captcha_code:focus {
            border-color: #007bff;
            box-shadow: 0 4px 8px rgba(0, 123, 255, 0.2);
        }

        #captcha_code:hover {
            border-color: #999;
        }

        .swal2-modal {
            width: 300px !important;
            /* Adjust width */
            max-width: 80%;
            /* Make it responsive */
            padding: 15px !important;
            /* Reduce padding */
        }

        .swal2-title {
            font-size: 18px !important;
            /* Smaller title */
            border-radius: 45px !important;
        }

        .swal2-text {
            font-size: 14px !important;
            /* Smaller text */
        }

        .swal2-html-container {
            padding: 0px !important;
        }

        .swal2-footer {
            padding: 10px !important;
            /* Reduce footer space */
        }

        div:where(.swal2-container) div:where(.swal2-actions) {
            display: flex;
            z-index: 1;
            box-sizing: border-box;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            width: auto;
            margin: 0.25em auto 0 !important;
            padding: 0;
        }

        div:where(.swal2-icon) {

            margin: 0.5em auto .6em !important;

        }

        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) button {
            background: linear-gradient(180deg, #FFD700 0%, #FFB800 50%, #FFD700 100%);
            /* Gold gradient */
            color: black;
            /* Black text */
            font-weight: bold;
            font-size: 16px;
            border: 2px solid #B8860B;
            /* Darker gold border */
            border-radius: 8px;
            padding: 12px 24px;
            cursor: pointer;
            text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.7);
            /* box-shadow: 0 4px 10px rgba(255, 223, 0, 0.5), inset 0 2px 4px rgba(255, 255, 255, 0.7); */
            transition: 0.3s ease-in-out;
            position: relative;
            overflow: hidden;
        }


/* Blue gradient button (SweetAlert2 confirm included) */
.goldenbutton,
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
  /* Colors */
  --blue-1: #0D3D8A;  /* base */
  --blue-2: #1E5BB8;  /* mid */
  --blue-3: #2E7DD5;  /* light */
  --blue-4: #63A4FF;  /* highlight */

  /* Gradient layers: subtle sheen + main blue sweep */
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(255,255,255,.15) 0 30%, transparent 60%),
    linear-gradient(135deg, var(--blue-1) 0%, var(--blue-2) 40%, var(--blue-3) 70%, var(--blue-4) 100%) !important;
border:none !Important;
  color: #fff !important;
  font-weight: 700;
  font-size: 16px;

  border: 1px solid var(--blue-1);
  border-radius: 10px;

  padding: 12px 24px;
  cursor: pointer;

  text-shadow: 0 1px 1px rgba(0,0,0,.25);
  box-shadow:
    0 6px 16px rgba(13, 61, 138, .35),
    inset 0 1px 0 rgba(255,255,255,.15);

  transition: transform .15s ease, filter .2s ease, box-shadow .2s ease;
  position: relative;
  overflow: hidden;
}

/* Hover: slight lift + brighter */
.goldenbutton:hover,
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow:
    0 10px 22px rgba(13, 61, 138, .45),
    inset 0 1px 0 rgba(255,255,255,.18);
}

/* Active: press down + a touch darker */
.goldenbutton:active,
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):active {
  transform: translateY(0);
  filter: brightness(.96);
  box-shadow:
    0 4px 12px rgba(13, 61, 138, .35),
    inset 0 2px 4px rgba(0,0,0,.12);
}

/* Focus ring for accessibility */
.goldenbutton:focus-visible,
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.9),
    0 0 0 6px rgba(13, 61, 138, .55);
}

/* Disabled state */
.goldenbutton:disabled,
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):disabled {
  opacity: .65;
  cursor: not-allowed;
  filter: none;
  transform: none;
}





        /* Gold background for the entire page */
/*        .goldenbutton,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #0D3D8A 0%, #0D3D8A 8%, rgb(215, 152, 15) 30%, rgb(219, 161, 24) 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #FFFFFF 0%, #FFFFAC 8%, #0D3D8A 25%, rgb(197, 143, 18) 62.5%, #0D3D8A 100%);
            color: black !important;
            
            font-weight: bold;
            font-size: 16px;
            border: 2px solid #0D3D8A;
        
            border-radius: 8px;
            padding: 12px 24px;
            cursor: pointer;
            text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.7);
            box-shadow: 0 4px 10px rgba(255, 221, 0, 0.75), inset 0 2px 4px rgba(255, 255, 255, 0.7); 
            transition: all 0.3s ease-in-out;
            position: relative;
            overflow: hidden;
        }

       
        .goldenbutton::before,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm)::before {
            content: "";
            position: absolute;
            top: -120%;
            left: -120%;
            width: 250%;
            height: 250%;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.4) 10%, transparent 50%);
            transform: rotate(25deg);
            transition: opacity 0.3s ease-in-out, transform 0.5s ease-in-out;
            opacity: 0;
        }

       
        .goldenbutton:hover,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):hover {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #FFE36E 0%, #FFC247 8%, #B58F39 30%, #9C7A36 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #FFFFFF 0%, #FFFFD6 8%, #E3C66F 25%, #755928 62.5%, #755928 100%);
            /* box-shadow: 0 6px 15px rgba(255, 223, 0, 0.7), inset 0 3px 5px rgba(255, 255, 255, 0.8); 
        }

  
        .goldenbutton:active,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):active {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #CFAF53 0%, #A4803E 8%, #7A5A27 30%, #5A4420 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #E3C66F 0%, #C3A654 8%, #8A6E2F 25%, #5D4A1F 62.5%, #5D4A1F 100%);
             box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.4); 
        }

     
        .goldenbutton:hover::before,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):hover::before {
            opacity: 1;
            transform: translate(100%, 100%);
        }


        a {
            text-decoration: underline !important;
        }
*/




        .goldenbutton1 {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #FEDB37 0%, #FDB931 8%, rgb(215, 152, 15) 30%, rgb(219, 161, 24) 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, rgb(197, 143, 18) 62.5%, #5d4a1f 100%);
            color: black !important;
            /* Black text */
            font-weight: bold;
            font-size: 16px;
            border: 2px solid #9f7928;
            /* Gold-toned border */
            border-radius: 8px;
            padding: 1px 1px;
            cursor: pointer;
            text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.7);
            /* box-shadow: 0 4px 10px rgba(255, 221, 0, 0.75), inset 0 2px 4px rgba(255, 255, 255, 0.7); */
            transition: all 0.3s ease-in-out;
            position: relative;
            overflow: hidden;
        }

        /* Shine effect */
        .goldenbutton1::before,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm)::before {
            content: "";
            position: absolute;
            top: -120%;
            left: -120%;
            width: 250%;
            height: 250%;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.4) 10%, transparent 50%);
            transform: rotate(25deg);
            transition: opacity 0.3s ease-in-out, transform 0.5s ease-in-out;
            opacity: 0;
        }

        /* Hover effect */
        .goldenbutton1:hover,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):hover {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #FFE36E 0%, #FFC247 8%, #B58F39 30%, #9C7A36 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #FFFFFF 0%, #FFFFD6 8%, #E3C66F 25%, #755928 62.5%, #755928 100%);
            /* box-shadow: 0 6px 15px rgba(255, 223, 0, 0.7), inset 0 3px 5px rgba(255, 255, 255, 0.8); */
        }

        /* Active (clicked) effect */
        .goldenbutton1:active,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):active {
            background: radial-gradient(ellipse farthest-corner at right bottom,
                    #CFAF53 0%, #A4803E 8%, #7A5A27 30%, #5A4420 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top,
                    #E3C66F 0%, #C3A654 8%, #8A6E2F 25%, #5D4A1F 62.5%, #5D4A1F 100%);
            /* box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.4); */
        }

        /* Shine animation on hover */
        .goldenbutton1:hover::before,
        div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm):hover::before {
            opacity: 1;
            transform: translate(100%, 100%);
        }