/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/


 .gamplify-invites-settings-admin .card {
    background: #fff;
    padding: 25px;
    border-left: 4px solid #0073aa;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    margin-top: 20px;
    max-width: 800px;
}

.gamplify-invites-settings-admin .card h3:first-of-type {
    color: #0073aa;
    margin-top: 0;
    font-size: 20px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}

.gamplify-invites-settings-admin .form-table th {
    padding-left: 0;
    width: 200px;
    vertical-align: top;
    font-weight: 600;
    color: #333;
}

.gamplify-invites-settings-admin .form-table td input[type="text"] {
    width: 100%;
    max-width: 400px;
}


.wrap.gamplify-invites-settings-admin {
  max-width: 900px;
  margin: 0 auto;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  animation: fadeIn 1s ease;
}

.gamplify-invites-settings-admin h1 {
  font-size: 2rem;
  margin-bottom: 1rem;
  color: #333;
  animation: slideInDown 0.8s ease;
}

.gamplify-invites-settings-admin .notice {
  border-left: 4px solid #00a0d2;
  padding: 1rem;
  margin-bottom: 1rem;
  background: #f1f1f1;
  animation: fadeInUp 0.6s ease;
}

.gamplify-invites-settings-admin .card {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  animation: zoomIn 0.5s ease;
}

.gamplify-invites-settings-admin .form-table th {
  text-align: left;
  font-weight: 600;
  width: 200px;
  vertical-align: top;
}

.gamplify-invites-settings-admin .form-table td {
  padding: 0.5rem 0;
}

.gamplify-invites-settings-admin input[type="radio"] {
  transform: scale(1.2);
  margin-right: 0.5rem;
}

.gamplify-invites-settings-admin .submit input[type="submit"] {
  background: #0073aa;
  color: #fff;
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.3s ease;
}

.gamplify-invites-settings-admin .submit input[type="submit"]:hover {
  background: #005a87;
}

.gamplify-invites-settings-admin code {
  background: #f5f5f5;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-family: monospace;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes slideInDown {
  from { transform: translateY(-20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes fadeInUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes zoomIn {
  from { transform: scale(0.95); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}


/* Shortcode Usage Section */
.gamplify-invites-settings-admin .card h3 + p {
    margin-top: 30px;
    font-weight: 500;
    font-size: 16px;
    color: #222;
}

.gamplify-invites-settings-admin code {
    background: #f3f3f3;
    padding: 6px 10px;
    display: inline-block;
    border-radius: 4px;
    font-family: monospace;
    font-size: 14px;
    color: #333;
}


.gamplify-invites-by-anyone-tabs #subnav #invite-new-members:before,
.gamplify-invites-by-anyone-tabs #subnav #sent-invites:before {
   	 background: url(../images/invite-anyone-sprites.png) no-repeat;
	  content: "";
	  width: 16px;
	  height: 16px;
	  display: inline-block;
	  vertical-align: middle;
	  margin-right: .6em;
}
	.gamplify-invites-by-anyone-tabs #subnav #invite-new-members:before {
		background-position: 0 0;
	}
	.gamplify-invites-by-anyone-tabs #subnav #sent-invites:before {
		background-position: -20px 0;
	}

.gamplify-invites-by-anyone-tabs #welcome-message,
.gamplify-invites-by-anyone-tabs #sent-invites-intro {font-size:14px;}

.gamplify-invites-by-anyone-tabs #invite-anyone-email-fields {
	margin: 15px 30px 0 0;
	list-style-type: lower-alpha;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps {
	margin: 0 20px;
	list-style-type: decimal;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps li {
	margin: 20px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps label,
.gamplify-invites-by-anyone-tabs #invite-anyone-steps p,
.gamplify-invites-by-anyone-tabs #invite-anyone-steps legend {
	font-weight:bold;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps label {
  display:block;
  margin-bottom:5px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps .cs_import {
	cursor: pointer;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-email-fields {
	width: 380px;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-email-field {
	width: 380px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-custom-subject {
	width: 400px;
	max-width: 100%;
	height: 30px;
}

.gamplify-invites-by-anyone-tabs label span.disabled-subject {
  font-style:italic;
  color:#8f8f8f;
  font-size:11px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-custom-message {
	width: 100%;
 	height: 130px;
	margin-bottom: 10px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list {
	list-style-type: none;
	margin: 0;
	padding: 0;
	clear: both;
	overflow:hidden;
	width:100%;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list li {
	width: 45%;
	margin: 5px 10px 10px 10px;
	float: left;
	height:60px;
	min-height: 60px;
	font-size: 11px;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list li img {
	margin-right: 5px;
	float: left;
	vertical-align:center;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list label {
	width: 85%;
	margin-bottom:0;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list label,
.gamplify-invites-by-anyone-tabs #invite-anyone-group-list input {
  cursor:pointer;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list label span {
  font-weight:normal;
  /*line-height:30px;*/ /*Breaks if group name is multiline*/
  line-height: 1.4em;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-group-list li input {
	float: left;
	margin:10px 6px;
	width:20px;
}

.gamplify-invites-by-anyone-tabs form#invite-anyone-by-email p {
	margin-bottom: 0;
}

.gamplify-invites-by-anyone-tabs form#invite-anyone-by-email .description {
	color: #8f8f8f;
	font-size: 11px;
	font-style: italic;
}

.gamplify-invites-by-anyone-tabs form#invite-anyone-by-email textarea {
	margin-top: .5em;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-group-name {
	float: left;
}

.gamplify-invites-by-anyone-tabs .invite-new-members .submit {
	clear: both;
	padding: 20px;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites {
	text-align: left;
}

.gamplify-invites-by-anyone-tabs thead tr {border-bottom:2px solid #555;}

.gamplify-invites-by-anyone-tabs thead tr th a.DESC:after,
.gamplify-invites-by-anyone-tabs thead tr th a.ASC:after {
  background: url(../images/invite-anyone-sprites.png) no-repeat;
  content: "";
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  margin-left: .6em;
}
	.gamplify-invites-by-anyone-tabs thead tr th a.DESC:after {
		background-position: -20px -40px ;
	}
	.gamplify-invites-by-anyone-tabs thead tr th a.ASC:after {
		background-position: 0 -40px ;
	}


.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tbody tr {
  border:2px solid #fff;
  border-left:none;
  border-right:none;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites th a {
	font-weight: normal;
	text-decoration: none;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites th.sort-by-me a {
	font-weight: bold;
	text-decoration: underline;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tbody tr td:first-child {
	width: 30px;
	text-align: center;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tr td:first-child a {
	text-decoration: none;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tr.over {
  background: #FFFEF3;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tr.accepted td {
  color: #09c622;
}

.gamplify-invites-by-anyone-tabs .invite-anyone-sent-invites tr.accepted td.date-joined span {
  background: url(../images/invite-anyone-sprites.png) no-repeat;
  background-position: -20px -20px ;
  width: 18px;
  height: 18px;
  margin-right: 0.4em;
  display: inline-block;
  vertical-align: bottom;
}

.gamplify-invites-by-anyone-tabs .clear-entry,
.gamplify-invites-by-anyone-tabs .clear-entry span {
  width:18px;
  height:16px;
}

.gamplify-invites-by-anyone-tabs .clear-entry {
  position:relative;
  display:block;
  text-indent:-999em;
}

.gamplify-invites-by-anyone-tabs .clear-entry span {
  position:absolute;
  left:0;
  background: url(../images/invite-anyone-sprites.png) no-repeat;
  background-position: 0px -20px ;
  width: 18px;
  height: 18px;
}

.gamplify-invites-by-anyone-tabs .clear-entry span:hover {
   -moz-box-shadow: inset 0 0 4px #CCC;
   -webkit-box-shadow: inset 0 0 4px #CCC;
   box-shadow: inset 0 0 4px #CCC;
}

.gamplify-invites-by-anyone-tabs tr#batch-clear {
  border-top:1px solid #8f8f8f;
}

.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links {
  overflow:hidden;
  width:100%;
}

.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links li {
  float:left;
  list-style-type: none;
}

.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links li a {
  padding-right:10px;
  border-right: 1px solid #555;
}

.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links li.last a {
  padding-left:10px;
  border:none;
}

.gamplify-invites-by-anyone-tabs #invite-anyone-steps div.invite-anyone-error p,
.gamplify-invites-by-anyone-tabs div.invite-anyone-error p {
	display: inline-block;
	font-weight: normal;
	border-bottom: 1px solid #FFE8C4;
	border-right: 1px solid #FFE8C4;
	margin: 15px 0;
	text-decoration: none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 10px 15px;
	font-size: 12px;
	display: block;
	background: #e41717;
	color: #fff;
	border-color: #a71a1a;
	clear: left;
}

.gamplify-invites-by-anyone-tabs textarea.invite-anyone-email-addresses {
	width: 400px;
	max-width: 100%;
	height: 130px;
}

.gamplify-invites-by-anyone-tabs .ia-pagination {
	position: relative;
	height: 30px;
	margin-top: 10px;
	color: #555;
	font-size: 11px;
}
	.gamplify-invites-by-anyone-tabs .ia-pagination .currently-viewing {
		position: absolute;
		top: 0;
		left: 0;
		font-style: italic;
	}
	.gamplify-invites-by-anyone-tabs .ia-pagination .pag-links {
		position: absolute;
		top: 0;
		right: 0;
	}
	.gamplify-invites-by-anyone-tabs .ia-pagination .page-numbers {
		margin-left: 8px;
	}

 .gamplify-invites-by-anyone-tabs .invite-response {
            margin-top: 15px;
            padding: 10px;
            border-radius: 5px;
        }
        .gamplify-invites-by-anyone-tabs .invite-success {
            background-color: #d4edda;
            color: #155724;
        }
        .gamplify-invites-by-anyone-tabs .invite-error {
            background-color: #f8d7da;
            color: #721c24;
        }


   .fancy-form-wrapper {
            max-width: 600px;
            margin: 25px auto;
            padding: 20px;
            background: #f9fafc;
            border-radius: 10px;
        }

        .fancy-form-wrapper input {
            width: 100%;
            padding: 15px;
            margin-bottom: 25px;
            border: 1px solid #ccc;
            border-radius: 6px;
            font-size: 16px;
        }

        .fancy-form-wrapper label {
            font-size: 14px;
            display: block;
            margin-bottom: 5px;
            color: #444;
            text-transform: uppercase;
        }

        .fancy-submit-btn {
            background-color: #3b5bff;
            color: white;
            padding: 12px 25px;
            border: none;
            border-radius: 25px;
            font-weight: bold;
            cursor: pointer;
            margin-top: 20px;
        }

        .password-wrap {
            position: relative;
        }

        .toggle-password, .toggle-cp-password {
            position: absolute;
            right: 15px;
            top: 33%;
            transform: translateY(-50%);
            cursor: pointer;
            font-size: 14px;
            color: #888;
        }

        .login-toggle-password{
            position: absolute;
            right: 15px;
            top: 33%;
            transform: translateY(-50%);
            cursor: pointer;
            font-size: 14px;
            color: #888;
        }


       #register-message {
    margin-top: 15px;
    padding: 12px 20px;
    border-radius: 5px;
    font-weight: 500;
    display: none; /* Hidden by default, shown via jQuery if needed */
}

#register-message.success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}
#register-message.success p, #register-message.error p{
	margin: 0;
}
#register-message.error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

#fancy-loader{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:9999;
	background:rgba(255,255,255,0.7);
	display:flex;
	justify-content:center;
	align-items:center;
}
.custom-spinner {
  border: 5px solid #ccc;
  border-top: 5px solid #0073aa;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


#register-message.error p {
    margin: 0;
}


/* Tablet and smaller screens */
@media screen and (max-width:800px) {
	.gamplify-invites-by-anyone-tabs #invite-anyone-group-list li {
		width: 90%;
	}
	.gamplify-invites-by-anyone-tabs #invite-anyone-group-list label {
		width: 75%;
	}
  .gamplify-invites-by-anyone-tabs table.invite-anyone-sent-invites .col-group-invitations {
		display: none;
	}
}

@media screen and (max-width:680px) {
	.gamplify-invites-by-anyone-tabs #invite-anyone-steps {
		margin-left: 0;
	}

	.gamplify-invites-by-anyone-tabs table.invite-anyone-sent-invites .col-date-invited {
		display: none;
	}
}

@media screen and (max-width:440px) {
	.gamplify-invites-by-anyone-tabs table.invite-anyone-sent-invites .col-date-joined {
		display: none;
	}

	.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links li {
		float: none;
		margin-left: 15px;
		padding-left: 0;
	}

	.gamplify-invites-by-anyone-tabs ul#invite-anyone-clear-links li a {
		border: 0;
		padding-left: 10px;
	}
}



#fancy-user-register-form .row.side-by-side-fields {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
}

#fancy-user-register-form  .row.side-by-side-fields input#fancy_first_name {
    margin-right: 10px;
    width: 100%;
}

#fancy-user-register-form .row.side-by-side-fields .password-wrap {width: 100%;margin-right: 10px;}








.login-section p {
    margin-bottom: 15px;
    font-weight: 600;
}

.forgot-password-wrap {
    margin-top: 15px;
    font-weight: 600;
}




/* Hide the login form initially */
#loginForm {
  display: none;
  margin-top: 15px;
}

/* Style the account link */
#login_account {
  cursor: pointer;
  color: #0073aa;
  font-weight: bold;
  text-decoration: underline;
}

#login_account:hover {
  color: #005177;
}
