/* CSS Document */
    button {
        font-size: 12px;
        font-family: sans-serif;
        cursor: pointer;
    }

    .submitBtn {
        /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4287f5), to(#172f57));
        background: linear-gradient(180deg, #4287f5 0, #172f57 100%); */
        height: 40px;
        width: 120px;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        color: #efeff1;
        /* border-radius: 8px; */
        border: 1px solid;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        /* gap: 8px; */
    }

    .submitBtn:hover {
        /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6b4afc), to(#563bca));
        background: linear-gradient(180deg, #6b4afc 0, #563bca 100%); */
        border-color: #eaeef2;
        -webkit-box-shadow: inset 0 0 10px white;
                box-shadow: inset 0 0 10px white;
        border: 1px solid;
        color: #eaeef2;
    }

    .cancelBtn {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #232934), to(#04070e));
        background: linear-gradient(180deg, #232934 0, #04070e 100%);
        height: 40px;
        width: 120px;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        color: #efeff1;
        /* border-radius: 8px; */
        border-color:#4287f5;
        border-width: 1px;
        border-style: solid;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 8px;
    }

    .cancelBtn:hover {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6b4afc), to(#563bca));
        background: linear-gradient(180deg, #6b4afc 0, #563bca 100%);
    }

    .searchBtn {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #232934), to(#04070e));
        background: linear-gradient(180deg, #232934 0, #04070e 100%);
        height: 40px;
        width: 120px;
        font-weight: 600;
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        color: #efeff1;
        /* border-radius: 8px; */
        border-color:#4287f5;
        border-width: 1px;
        border-style: solid;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 8px;
    }

    .searchBtn:hover {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6b4afc), to(#563bca));
        background: linear-gradient(180deg, #6b4afc 0, #563bca 100%);
    }

.glowBtn {
  /* Base button styles */
  font-size: 14px;
  font-family: sans-serif;
  width: 120px;
  padding: 11px;
  margin: 10px 10px;
  border: none;
  border-radius: 15px;
  cursor: pointer;
  background-color: transparent;
  color: white; /* Adjust text color as needed */
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; /* Smooth transition on hover */
  
  /* Glow effect */
  -webkit-box-shadow: 0 0 5px rgba(36, 100, 236, 0.3);
          box-shadow: 0 0 5px rgba(59, 138, 240, 0.96);
}

.glowBtn:hover {
  /* Enhance glow on hover */
  -webkit-box-shadow: 0 0 10px rgba(36, 100, 236, 0.3);
          box-shadow: 0 0 10px rgba(255, 255, 255, 0.9); /* Increase glow size and opacity */
}

.btn-cta {
    width: 275px;
}

    .share-buttons {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-top: 1rem; 
    }

    .app-button {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 60px;
        height: 60px;
        margin: 0 16px;
        border-radius: 50%;
        text-decoration: none;
        -webkit-transition: -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
        transition: -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
        transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
        transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out, -webkit-box-shadow 0.1s ease-in-out;
    }

    .app-button:hover {
        /* Hover effect for all app buttons */
        -webkit-transform: translateY(-2px);
                transform: translateY(-2px);
        -webkit-box-shadow: 0 7px 15px rgba(0, 0, 0, 0.5);
                box-shadow: 0 7px 15px rgba(0, 0, 0, 0.5);
    }

    .app-button img {
        max-width: 100%;
        max-height: 100%; 
        height: auto;
        width: auto;
    }

    .app-button-primary {
        background-color: #66afe9;
        color: #ffffff;
    }

    .app-button-primary:hover {
        background-color: #549ed7;
    }

    .app-button-secondary {
        background-color: #555;
        color: #ffffff;
    }

    .app-button-secondary:hover {
        background-color: #666;
    }

    .app-button-danger {
        background-color: #dc3545;
        color: #ffffff;
    }

    .app-button-danger:hover {
        background-color: #c82333;
    }

    .app-button-outline-warning {
        color: #ffc107;
        border: 1px solid #ffc107;
    }

    .app-button-outline-warning:hover {
        color: #000;
        background-color: #ffc107;
        border-color: #ffc107;
    }

    .app-button.loading-button { /* Style for button in loading state */
        opacity: 0.7; /* Faded opacity */
        cursor: wait; /* Change cursor to "wait" to indicate loading */
        position: relative; /* Position relative for spinner placement */
        padding-left: 2.5em; /* Add padding to the left to make space for spinner */
    }

    .app-button.loading-button::before { /* Spinner pseudo-element */
        content: "";
        position: absolute;
        left: 1em; /* Adjust spinner position within button */
        top: 50%;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%); /* Vertically center spinner */
        display: inline-block;
        width: 1em; /* Spinner size - adjust as needed */
        height: 1em;
        border: 0.2em solid #fff; /* Spinner border - adjust color to button text color or desired color */
        border-radius: 50%;
        border-top-color: transparent; /* Make top border transparent for spinner effect */
        -webkit-animation: button-spinner 1s linear infinite;
                animation: button-spinner 1s linear infinite; /* Apply spinner animation */
    }

    @-webkit-keyframes button-spinner {
        to { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); }
    }

    @keyframes button-spinner {
        to { -webkit-transform: translateY(-50%) rotate(360deg); transform: translateY(-50%) rotate(360deg); }
    }