*,::after,::before{box-sizing:border-box;margin:0;padding:0}
body{font-family: 'Urbanist', sans-serif;margin:0;padding:0;background:#020259;font-size:1rem; color: #fff;background-image: url(https://www.tv9x.com/awards/ai-content/registration/images/AI-Awards-BG.png);}
img{max-width:100%;display: block;}
.container{max-width:1200px;margin:0 auto}
ul{list-style:none;padding:0;margin:0}
a{text-decoration:none;color:#fff}
.flex{display:flex}
.text-center{text-align:center}
header{position:fixed;width:100%;padding:0.3125rem 0;z-index: 9;background: #13072F;}
header.darkHeader{background-color:rgba(0,0,0,0.5);z-index:2}
.MenuBtn{display:none}
header .container{display:flex;justify-content:space-between;align-items:center}
nav ul{display:flex}
nav ul li{display:inline-block;margin:0 0.9375rem}
nav ul li:last-child{border-bottom:none; margin-right: 0px;}
nav ul li a{font-size:0.875rem;color:#fff;font-weight:400;line-height:1.25rem;text-transform:uppercase;}
nav ul li a:hover{opacity: 0.8;}
nav ul li a.Register{color: #FFE462;}
header .rgt_col{display:flex;align-items:center;justify-content:space-between}
header .logo {background: #100628; padding: 10px 0px;width: 140px; position: relative;margin-top: -82px; top: 74px;display: flex; justify-content: center;}
header.darkHeader .logo{width: 100px; margin-top: -60px; top: 50px;}
.darkHeader .logo:after{bottom: -10px;border-left: 50px solid transparent;border-right: 50px solid transparent;border-top: 10px solid #100628;}
header.darkHeader .logo img {width: 80px;height: auto;}
.logo:after {content: ""; position: absolute; bottom: -20px; left: 0; width: 0; height: 0; border-left: 70px solid transparent; border-right: 70px solid transparent; border-top: 20px solid #100628;}
header .logo img{display:block;max-width:10rem; width:auto; height: auto;}
header .logo h1{display:none;}
.commanPage_Wrapper{padding:3.125rem 0}

.page-wrap{background-image: url(https://www.tv9x.com/awards/ai-content/registration/images/AI-Awards-BG.png);background-repeat: no-repeat; background-size: cover; min-height: 100vh; padding-top: 6.25rem;padding-bottom: 2.5rem;}
/*Login Page*/
.auth-card {background: #fff;border-radius: 16px;box-shadow: 0 10px 30px rgba(0, 0, 0, .08);max-width: 420px;width: 100%;overflow: hidden;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.auth-content {padding: 20px;}
.auth-heading{font-size: 24px; color: #9125fb; text-align: center; text-transform: capitalize; margin-bottom: 10px;}
.auth-title {font-size: 24px;font-weight: 700;text-align: center;line-height:30px;margin-bottom: 15px;color: #000;}
.auth-subtitle {font-size: 15px;text-align: center;color: #666666; margin-bottom: 18px;}
.auth-section {display: none;}
.auth-section.active {display: block;}
.google-block {margin-bottom: 16px;}
.google-block .label {font-size: 14px;color: #000;margin-bottom: 8px;text-align: center;}
.google-btn-wrap {display: flex;justify-content: center;}
#googleSignInDiv {width: 100%;display: flex;justify-content: center;}
.form-group {margin-bottom: 12px;}
.form-label {font-size: 18px;margin-bottom: 10px;color: #000;display: block;font-weight: 600;}
.form-input, .form-select {width: 100%;padding: 12px 10px;border-radius: 8px;border: 1px solid #ddd;font-size: 16px;box-sizing: border-box;font-weight: 500;}
.btn-primary {background: #9125fb;color: #fff;font-size: 16px;font-weight: 600;border: none;padding: 12px 22px;border-radius: 6px;cursor: pointer;width: 100%;transition: 0.25s ease-in-out;text-transform: uppercase;margin-right: 10px;}
.btn-primary:hover{background: #6d20b9;}
.otp-row {display: flex;gap: 8px;margin-top: 6px;}
.otp-row input {flex: 1;}
.message {font-size: 12px;margin-top: 6px;}
.small-text {font-size: 11px;color:#666666;text-align: center;margin-top: 10px;line-height: 1.4;}
.small-text a {color: #9125fb;text-decoration: none;}

/*From Page css*/
.section {position: relative;align-items: center;display: flex;padding: 10px 0;}
    .heading {display: flex;margin-bottom: 20px;align-items: center;justify-content: center;}
    .heading h2 {text-transform: uppercase;font-family: 'Urbanist', sans-serif;font-size: 42px}
    .heading span {margin-left: 5px;text-transform: capitalize;font-family: 'Urbanist', sans-serif;font-size: 20px;font-weight: 700}
    .form {padding-top: 30px;}
    .login-form {background: #fff;border-radius: 20px;width: 100%;padding:30px 30px 10px 30px;text-align: center;margin-bottom: 20px;box-shadow: 0px 4px 8px 0px #D9D9D94D;}
    .login-form h3{font-size:24px;font-weight:600; margin-bottom:10px;color: #000; text-align: left;}
    .login-form h3 span{font-size:13px;font-weight:400;display: block;line-height: 20px;}
    .login-form .form-field {text-align: left;color: #525252;transition: opacity 0.4s ease;}
    .formHeading h3{font-size:28px;font-weight:700;text-align: center;color:#000;margin-bottom:20px;}
    .form-field.hide {opacity: 0;pointer-events: none;}
    .form-field.show {opacity: 1;}
    .form2col {display: flex;align-items: center;justify-content: space-between;}
    .form-group {margin-bottom: 30px;width: 100%;margin-right: 20px;border-radius: 10px;background: #F5F5FF;padding: 15px;}
    .formWrapCon{background:#fff;padding:0;}
    .formWrapCon.pay-actions{margin: 0;}
    .groupCheck{margin-bottom:20px;}
    .form2col .form-group:last-child {margin-right: 0;}
    .form-field label,.form-label{color: #000000;font-size: 16px;line-height: 2;font-weight: 600;margin-bottom: 0px;text-align: left;}
    .form-control {display: block;width: 100%;height: 34px;padding: 10px;font-size: 16px;line-height: 1.42857143;color: #555555;background-color: #fff;background-image: none;border: 1px solid #D9D9D9;border-radius: 10px;-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);height: 50px;}
    .login-form .form-field input, .login-form .form-field select {width: 100%;padding: 10px;background-color: #fff;border: 1px solid #D9D9D9;border-radius: 10px;height: 50px;position: relative;}
    .login-form .form-field input:focus,.form-control:focus{border-color:#93f;}
    .login-form .form-field input:focus,.login-form .form-field select:focus,.login-form .form-group textarea:focus, .form-control:focus {border-color: #93f;outline: none;}
    .select_checkbox {width: 100%;padding-right: 30px;display: flex;justify-content: flex-start;align-items: center;flex-wrap: wrap; margin-top: 10px;}
    .select_checkbox .select_time {display: flex;align-items: center;justify-content: flex-start;margin-right: 25px;}
    .select_checkbox .select_time input {width: 15px;height: 15px;margin-right: 6px;}
    .select_checkbox .select_time label {line-height: 15px;font-weight:400;font-size:16px;color:#555555;}
    div#errorMsg {color: #dc0000;text-align: center;margin: 10px 0;width: 100%;float: left;display: none;font-size: 20px;}
    .d-flex {display: flex;align-items: center;justify-content: center;}
    .form-group input[type=submit] {background: #9125fb;color: #fff;font-size: 16px;font-weight: 600;border: none;padding: 12px 22px;border-radius: 6px;cursor: pointer;max-width: 140px;transition: 0.25s ease-in-out;text-transform: uppercase;margin-right: 10px;height:42px}
    .form-group input[type=submit]:hover{background: #6d20b9;}
    .reset {background: #000000 !important;}
    .form-group span{display:block;font-weight:400;font-size:14px;line-height:20px;margin-bottom:8px;}
    #otherInputWrap{width: 42%; margin-top:10px;}
    #otherInputWrap input{width: 100%;padding: 8px;border: 1px solid #D9D9D9;border-radius: 10px; height:50px;}
    .form-group ul{padding-left:20px;}
    .form-group ul li{list-style-type: disc;}
    .form-group textarea{width: 100%;padding: 10px;background-color: #fff;border: 1px solid #D9D9D9;border-radius: 10px;height: 70px;position: relative;}
    .form-field .h4{font-size:18px;font-weight:600;color:#020259;}
    .terms1{display:flex;justify-content:flex-start;align-items:flex-start;margin-bottom:10px;}
    .terms1 input[type=checkbox]{height:15px;width:15px;margin-right:10px;}
    .terms1 label{font-size:14px;line-height:20px;font-weight:500;text-transform: none;color: #000;}
    .terms1 label a{color:#9125fb;text-decoration: underline;}
    .terms1 label a:hover{text-decoration: none;}
    .mandatory{display:block;text-align:right;font-size:12px;font-weight:400;color:#000;line-height:20px;margin-bottom:8px}
    .money9logo{height:100%;width: 50px;}
    .mandatory b{color: #dc0000;}
    .continue {background: #9125fb;color: #fff;font-size: 16px;font-weight: 600;border: none;padding: 12px 22px;border-radius: 6px;cursor: pointer;max-width: 250px;transition: 0.25s ease-in-out;text-transform: uppercase;margin-right: 10px;margin-bottom:5px;}
    .continue:hover {background: #6d20b9;}
    .profilePage{background: #fff;border-radius: 20px;width: 100%;padding: 35px;text-align: center;margin-bottom: 20px;box-shadow: 0px 4px 8px 0px #D9D9D94D;}
    .profilePage .heading h2{font-size:30px;font-weight:700;text-transform: capitalize;color:#000;}
    .profilePage .summary{font-size:16px;line-height:24px;margin-bottom:30px;font-weight:400;text-align:left;color:#000;}
    .profilePage .profileWrap{display:grid;gap:20px;align-items:flex-start;justify-items:center;}
    .profilePage .profileWrap .profileflieds{width:100%;}
    .profilePage .profileWrap .profileflieds .titleWrap{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
    .profilePage .profileWrap .profileflieds .titleWrap h3{font-size:20px;font-weight:600;text-transform: capitalize;color:#000;}
    .profilePage .profileWrap .profileflieds .titleWrap .edit-btn {font-size: 14px;cursor: pointer;padding: 4px 10px;background: #fff;border-radius: 20px;border: 1px solid #E5E5F6;transition: 0.3s;color:#000;}
    .profilePage .profileWrap .profileflieds .titleWrap .edit-btn:hover { background: #d6d6d6; }

    .infobox{background: #fff;border-radius: 20px;width: 100%;padding: 20px;text-align: center;margin-bottom: 20px;box-shadow: 0px 4px 8px 0px #D9D9D94D;}
    .infobox .heading h2{font-size:26px;font-weight:700;text-transform: capitalize;color:#000;line-height: 32px;}
    .infobox ul{padding-left:20px;margin-top:15px;text-align:left;}
    .infobox ul li{list-style-type: disc;font-size:14px;line-height:24px;margin-bottom:8px;color:#000;font-weight:400;}
    .infobox .profileWrap{display:grid;gap:20px;align-items:flex-start;justify-items:center;}
    .infobox .profileWrap .profileflieds{width:100%;}
    .infobox .profileWrap .profileflieds .titleWrap{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
    .infobox .profileWrap .profileflieds .titleWrap h3{font-size:20px;font-weight:600;text-transform: capitalize;color:#000;}
    .infobox .profileWrap .profileflieds .titleWrap .edit-btn {font-size: 14px;cursor: pointer;padding: 4px 10px;background: #fff;border-radius: 20px;border: 1px solid #E5E5F6;transition: 0.3s;color:#000;}
    .infobox .profileWrap .profileflieds .titleWrap .edit-btn:hover { background: #d6d6d6; }


    .btn-pay {background: #9125fb;color: #fff;font-size: 16px;font-weight: 600;border: none;padding: 12px 22px;border-radius: 6px;cursor: pointer;min-width: 200px;transition: 0.25s ease-in-out;	}
	.btn-pay:hover {background: #6d20b9;}
	.btn-continue {background: #cccccc;color: #555;font-size: 16px;font-weight: 600;border: none;padding: 12px 22px;border-radius: 6px;min-width: 150px;cursor: not-allowed;opacity: 0.7;transition: 0.25s ease-in-out;}
	.btn-continue.enabled {background: #9125fb;color: #fff;cursor: pointer;opacity: 1;}
	.btn-continue.enabled:hover {background: #146c43;}
    .fromCategoryWise {margin: auto;}
    .categoryBox {border-radius: 8px;overflow: hidden;margin-bottom: 20px;}
    .categoryBox.active{border:1px solid #efefff;}
    .toggleHeader {background: #efefff;padding: 20px;font-size: 18px;font-weight: 600;cursor: pointer;display: flex;justify-content: space-between;align-items: center;transition: background 0.3s;color:#000;}
    .toggleHeader:hover {background: #efefff;}
    .toggleHeader .arrow {width: 10px;height: 10px;border-right: 2px solid #020259;border-bottom: 2px solid #020259;transform: rotate(45deg);transition: transform 0.3s ease;}
    .categoryBox.active .toggleHeader .arrow {transform: rotate(225deg);}
    .toggleContent {display: none;padding: 10px;animation: slideDown 0.3s ease forwards;}
    @keyframes slideDown {
      from {
        opacity: 0;
        transform: translateY(-5px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .paid-badge {
    position:absolute;
    top:0;
    left:0;
    width:80px;
    height:80px;
    background:#22c55e;             /* green */
    clip-path:polygon(0 0, 100% 0, 0 100%); /* triangle */
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .paid-badge span{
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    transform: rotate(-45deg) translate(-2px, -2px);
    transform-origin: center;
    pointer-events: none;
    position: absolute;
    top: 15px;
    left: 10px;
  }
  .disabled-group {
    pointer-events: none;
    opacity: 0.6;
}
.entryWrapper{display: grid;  grid-template-columns: 1fr 250px;gap: 20px;background: #fff;border-radius: 20px;width: 100%;padding: 30px 30px 10px 30px;text-align: center; margin-bottom: 20px;box-shadow: 0px 4px 8px 0px #D9D9D94D;}
.entryWrapper .login-form{box-shadow: none; padding: 0;}
.entryWrapper .rgtCol{width: 100%; }

.entryWrapper .rgtCol .top-section {
    
    
    border-radius: 10px;
    background: #F5F5FF;
    padding: 10px;
}
.entryWrapper .rgtCol .profileDetails{display: flex;
    align-items: center;margin-bottom: 15px;}
.entryWrapper .rgtCol .top-section .profile-img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 10px;
}
.entryWrapper .rgtCol .top-section .profile-img img {
    width: 100%;
    height: 100%;
        background: #dadafb;
    padding: 10px;
}
.entryWrapper .rgtCol .top-section .profile-info {
    text-align: left;
}
.entryWrapper .rgtCol .top-section .profile-info h3 {
    font-size: 16px;
    font-weight: 600;
       color: #000;
       
}
.entryWrapper .rgtCol .top-section  p {
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 5px;
    color: #555;
    text-align: center;
}
.entryWrapper .rgtCol .edit-btn {
    font-size: 14px;
    cursor: pointer;
    padding: 4px 10px;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #E5E5F6;
    transition: 0.3s;
    color: #000;
    display: inline-block;
    margin-bottom: 10px;
}
/* Overlay */
.popup-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(2px);
    z-index: 9998;
}

/* Popup */
.popup-box {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 90%;
    max-width: 400px;
    padding: 25px;
    border-radius: 10px;
    z-index: 9999;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    color:#000;
}
.popup-box p{font-size: 16px; line-height: 24px; font-weight: 400;}
/* Close Button */
.popup-close {
    position: absolute;
    top: 8px;
    right: 10px;
    background: transparent;
    border: none;
    font-size: 22px;
    cursor: pointer;
}

@media(max-width:767px){
.d-flex{flex-wrap: wrap;}
.flex{flex-wrap:wrap}
.container{width:100%;padding:0 0.625rem;box-sizing:border-box}
.heading h2{font-size: 26px; text-align: center;}
header .left_col{display:flex;align-items: center;width: 100%; justify-content: space-between;flex-direction: row-reverse;}
header .logo{ width: 100px; margin-top: -60px; top: 50px;}
.logo:after {bottom: -10px;border-left: 50px solid transparent;border-right: 50px solid transparent;border-top: 10px solid #100628;}
header .logo img{width:80px;height:auto;}
.MenuBtn{float:left;margin:0;cursor:pointer;display:block;margin-right:1.25rem; padding: 10px 0px;}
.open-nav .MenuBtn{position:absolute;z-index:99;right:0.6875rem;top:-6px}
.MenuBtn i{width:1.25rem;display:block;border-top:0.125rem solid #fff;padding-top:0.25rem}
.MenuBtn i:nth-child(2){top:1.4375rem}
.MenuBtn i:nth-child(3){top:1.6875rem}
.open-nav .MenuBtn{position:absolute;z-index:99;top:1.875rem}
.open-nav .MenuBtn i{padding-top:0}
.open-nav .MenuBtn i:first-child{-webkit-transform:translateY(0) rotate(45deg);-moz-transform:translateY(0) rotate(45deg);-ms-transform:translateY(0) rotate(45deg);-o-transform:translateY(0) rotate(45deg);transform:translateY(0) rotate(45deg)}
.open-nav .MenuBtn i:nth-child(2){display:none}
.open-nav .MenuBtn i:nth-child(3){-webkit-transform:translateY(0) rotate(-45deg);-moz-transform:translateY(0) rotate(-45deg);-ms-transform:translateY(0) rotate(-45deg);-o-transform:translateY(0) rotate(-45deg);transform:translateY(0) rotate(-45deg);margin-top:-2px}
.sidenav{height:100%;width:0;position:fixed;z-index:9;top:0;left:0;background-color:#000;overflow-x:hidden;transition:.2s;padding-top:0;box-shadow:0.125rem 0.5rem 1.25rem rgba(0,0,0,.24);margin-top:0}
.open-nav .sidenav{width:100%}
nav ul{display:block;padding:2.5rem;text-align:center}
nav ul li{width:100%;margin:0;padding:1.25rem 0.625rem;box-sizing:border-box;border-bottom:0.0625rem solid #7b7b7b;height:100%}

/*Login Page*/
.auth-card {width: 320px;}
.auth-title{font-size: 22px;line-height: 30px;}

/*Form page*/
   .login-form {padding:40px 15px 20px 15px;}
    .form2col {flex-wrap: wrap;}
    .form-group {margin-right: 0;margin-bottom:20px;}
    .select_checkbox .select_time{margin-bottom:10px;width: 100%;}
    .select_checkbox{padding-right:0;}
    .groupCheck .select_checkbox .select_time{width: 45%; margin-right:10px;}
    .form-field .h4{font-size:16px;}
    .profilePage{padding: 20px;}
    .infobox{padding: 15px;}
    .infobox .heading{margin-bottom: 10px;}
    .infobox .heading h2{font-size:18px;line-height:22px;}
    .infobox ul li{font-size:12px;line-height:18px;}
    .paid-badge{width: 50px;height: 50px;}
    .paid-badge span{font-size: 14px;top: 10px;left: 7px;}
    .entryWrapper{grid-template-columns: 1fr; padding: 20px;}
    .profile-menu{margin-left: 0;}

}










/* ----------------------------------------------
   GLOBAL MESSAGE / ALERT BOXES
   Used with: <div id="form-message-area"><div class="msg-box msg-success">...</div></div>
---------------------------------------------- */
#form-message-area {
    margin-bottom: 20px;
}

.msg-box {
    position: relative;
    padding: 12px 14px;
    border-radius: 8px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.5;
    animation: fadeIn 0.25s ease-in-out;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* Common icon/indicator dot */
.msg-box::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-top: 6px;
    border-radius: 50%;
}

/* SUCCESS */
.msg-success {
    background: #e7f9ed;
    border: 1px solid #33b864;
    color: #156c34;
}
.msg-success::before {
    background: #33b864;
}

/* ERROR */
.msg-error {
    background: #fdeaea;
    border: 1px solid #d9534f;
    color: #a32121;
}
.msg-error::before {
    background: #d9534f;
}

/* WARNING */
.msg-warning {
    background: #fff8e5;
    border: 1px solid #ffba00;
    color: #a67b00;
}
.msg-warning::before {
    background: #ffba00;
}

/* INFO */
.msg-info {
    background: #e9f4ff;
    border: 1px solid #5ba4e6;
    color: #1c5f8c;
}
.msg-info::before {
    background: #5ba4e6;
}

/* Fade animation */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ----------------------------------------------
   INLINE FIELD ERRORS (below each input)
   Used with: <div class="help-block-error"></div>
---------------------------------------------- */
.help-block-error {
    font-size: 12px;
    color: #d62020;
    margin-top: 4px;
    min-height: 14px;    /* reserves space so layout doesn't jump */
}

/* Highlight invalid fields */
.form-control.error,
.input-wrapper input.error,
.input-wrapper select.error,
textarea.error {
    border-color: #d62020 !important;
    background: #fff;
}

/* When an entire radio group is invalid */
.radio-error,
#user-type-group.error {
    border-radius: 6px;
    padding: 8px 10px;
    border: 1px solid #d62020;
    background: #fff5f5;
}

/* Optional: subtle shake animation for invalid submit (if you want) */
.shake {
    animation: shake 0.18s linear 0s 2;
}

@keyframes shake {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(-3px); }
    50%  { transform: translateX(3px); }
    75%  { transform: translateX(-2px); }
    100% { transform: translateX(0); }
}