@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400..900&display=swap');
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* =========================
   GooGro — Safe Theme Layer
   (No layout/spacing changes)
   ========================= */

/* ---- Tokens ---- */
:root {
  --gg-primary:#29166F;
  --gg-primary-600:#231360;
  --gg-accent:#8B5CF6;

  --gg-text:#0f1115;
  --gg-muted:#8b8e98;

  --gg-surface:#ffffff;
  --gg-surface-2:#fafafa;

  --gg-line:#eaeaf0;
  --gg-line-strong:#d8d8e5;

  --gg-success:#10B981;
  --gg-warn:#F59E0B;
  --gg-danger:#EF4444;

  --gg-radius-1:10px;
  --gg-radius-2:12px;

  --gg-shadow-1:0 4px 12px rgba(16, 18, 27, .06);
  --gg-shadow-2:0 10px 24px rgba(16, 18, 27, .10);
}

/* ---- Base text color only (no spacing/layout) ---- */
body{ color:var(--gg-text); }

/* ---- Headings weight & color only ---- */
h1,h2,h3,h4,h5,h6{
  color:var(--gg-text);
  font-weight:700;
}
h1{ font-weight:800; }

/* ---- Links in greys when idle ---- */
a{ color:var(--gg-primary); }
a.complete-profile{ color:#7a7e88; }
a.complete-profile:hover{ color:var(--gg-text); }

/* ---- Cards / panels: only border, radius, shadow, bg ---- */
.dashboard-item,
.profile-content{
  background:var(--gg-surface);
  border:1px solid var(--gg-line);
  border-radius:var(--gg-radius-2);
  box-shadow:var(--gg-shadow-1);
}

/* ---- Side menu visuals (no width/padding changes) ---- */
.sidemenu{
  background:var(--gg-surface);
  border-right:1px solid var(--gg-line);
}
.my-menu li a{
  color:#616672;
  border:1px solid transparent;
  border-radius:var(--gg-radius-1);
  background:transparent;
  box-shadow:none;
}
.my-menu li a:hover,
.my-menu li a.active{
  color:var(--gg-text);
  background:#f5f6fb;
  border-color:#ececff;
}

/* ---- Top nav color only ---- */
.topmenu{
  border-bottom:1px solid var(--gg-line);
  box-shadow:0 1px 0 rgba(16,18,27,.02);
}
.topmenu .adminMenu li a{
  color:#7a7e88;
}
.topmenu .adminMenu li a:hover,
.topmenu .adminMenu li a.active{
  color:var(--gg-primary);
}

/* ---- Buttons: color/gradient/shadow only ---- */
.form-holder button,
a.edit,
a.email{
  background:linear-gradient(180deg,var(--gg-primary),var(--gg-primary-600));
  color:#fff !important;
  border:1px solid #241256;
  border-radius:var(--gg-radius-1);
  box-shadow:var(--gg-shadow-1);
}
a.view{ background:var(--gg-warn) !important; color:#1a1406 !important; border:1px solid #d98b08; }
a.approve, a.allow{ background:var(--gg-success) !important; color:#052d22 !important; border:1px solid #0da373; }
a.disapprove, a.disallow{ background:var(--gg-danger) !important; color:#3d0a0a !important; border:1px solid #cc3939; }
.edit-options li a{
  background:#111;
  color:#fff;
  border:1px solid #2b2b2b;
  border-radius:8px;
  box-shadow:var(--gg-shadow-1);
}

/* ---- Forms: only colors, borders, focus ring ---- */
.form-holder label{ color:#3b3f45; }
.form-holder input[type="text"],
.form-holder input[type="email"],
.form-holder input[type="password"],
.form-holder input[type="number"],
.form-holder select,
.member-list input[type='text'],
.member-list input[type='tel'],
.member-list input[type='email'],
.member-list select,
.member-list textarea{
  background:#f7f8fb;
  border:1px solid var(--gg-line);
  border-bottom-color:var(--gg-line-strong);
  color:#1b1e24;
  border-radius:8px;
  box-shadow:inset 0 0 0 0 transparent;
}
.form-holder input:focus,
.member-list input:focus,
.member-list select:focus,
.member-list textarea:focus{
  outline:none;
  background:#fff;
  border-color:#d8d8ff;
  box-shadow:0 0 0 4px rgba(41,22,111,.08);
}

/* Search input icon color only */
.member-search-area:before{ color:#7f8591; }

/* ---- Tables: only zebra, border, header color ---- */
table.table{
  background:#fff;
  border:1px solid var(--gg-line);
  border-radius:12px;
  box-shadow:var(--gg-shadow-1);
}
.table thead th{
  background:linear-gradient(180deg,#fff,#f9f9ff);
  color:#3b3f45;
  border-bottom:1px solid var(--gg-line);
}
.table tbody tr:nth-child(even){ background:#fcfcff; }
.table tbody tr:hover{ background:#f5f6ff; }

/* ---- Alerts: only color/border ---- */
.alert.successful{
  background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; border-radius:8px;
}
.alert.failed{
  background:#fef2f2; color:#7f1d1d; border:1px solid #fecaca; border-radius:8px;
}

/* ---- Progress bar colors only ---- */
.account-percentage{ background:#f0f2ff; border:1px dashed #d7d8ff; border-radius:8px; }
.inner-percentage{
  background:linear-gradient(90deg,var(--gg-primary) 0%, var(--gg-accent) 100%) !important;
  color:#fff;
}

/* ---- Login card: subtle glass look (no size/pos changes) ---- */
.homepage .login{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.7);
  border-radius:14px;
  box-shadow:var(--gg-shadow-2);
  backdrop-filter:blur(6px);
}

/* ---- Status pill helpers (optional) ---- */
.badge{
  display:inline-block;
  padding:.35em .6em;
  border-radius:999px;
  font-weight:700;
  font-size:.75rem;
  border:1px solid transparent;
}
.badge--success{ color:#065f46; background:#ecfdf5; border-color:#a7f3d0; }
.badge--warn{ color:#78350f; background:#fffbeb; border-color:#fde68a; }
.badge--danger{ color:#7f1d1d; background:#fef2f2; border-color:#fecaca; }
.badge--info{ color:#1e3a8a; background:#eef2ff; border-color:#c7d2fe; }

/* ---- Select2 visuals only (no sizing beyond border-radius/color) ---- */
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple{
  border:1px solid var(--gg-line) !important;
  background:#f7f8fb !important;
  border-radius:8px !important;
}
.select2-dropdown{
  border:1px solid #e2e2ff !important;
  border-radius:10px !important;
  box-shadow:var(--gg-shadow-2);
}

/* ---- PDF viewer border only ---- */
.pdf-view{
  border:1px solid var(--gg-line);
  border-radius:10px;
  box-shadow:var(--gg-shadow-1);
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	font-family:"Inter",sans-serif;
}

.site-logo {
	width:100%
}
.homepage.login-screen {
	min-height: 100vh;
	background:url('../../app/lib/img/background.webp') no-repeat center;
}
.homepage.login-screen:after {
	content:"";
	height:100%;
	width: 100%;
	position: absolute;
	background: rgb(27,27,27);
	background: linear-gradient(275deg, rgba(27,27,27,0) 0%, rgba(27,27,27,1) 85%);
}
.homepage .login {
	background:#ffffff;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	min-width: 20vw;
	position: absolute;
	z-index:9;
	border-radius:12px;
	padding:2em;
	box-shadow:0 0 30px rgba(27,27,27,0.2);
}
h1 {
	font-size:2.75em;
	font-family:'Inter',sans-serif;
}
h2 {
	font-size:2.45em;
	font-family:'Inter',sans-serif;
}
h3 {
	font-size:2.1em;
	font-family:'Inter',sans-serif;
}
h4 {
	font-size:1.85em;
	font-family:'Inter',sans-serif;
}
h5 {
	font-size:1.225em;
	font-family:'Inter',sans-serif;
}
h6 {
	font-size:0.95em;
	font-family:'Inter',sans-serif;
}
.font-inter {
	font-family:'Inter',sans-serif;
}
.font100 {
	font-weight:100;
}
.font200 {
	font-weight:200;
}
.font300 {
	font-weight:300;
}
.font400 {
	font-weight:400;
}
.font500 {
	font-weight:500;
}
.font600 {
	font-weight:600;
}
.font700 {
	font-weight:700;
}
.font800 {
	font-weight:800;
}
.font900 {
	font-weight:900;
}
.text-center {
	text-align:center;
}
.form-holder {
	padding:1.5em 0;
}
.form-holder label {
	font-family:'Inter',sans-serif;
}
.form-holder input[type="text"],
.form-holder input[type="email"],
.form-holder input[type="password"],
.form-holder input[type="number"],
.form-holder select {
	font-family:"Inter",sans-serif;
	background:#f9f9f9;
	border-radius:0;
	border:0;
	border-bottom:1px solid #999999;
}
.loginlinks a {
	color:#999999;
	text-decoration: none;
	font-size:0.9em;
}
.form-holder button {
	width:100%;
	text-align: center;
	background:#29166F;
	border:0;
}
.alert.successful,
.alert.failed {
	font-size:0.9em;
}
.dashboard.homepage {
	display:flex;
}
.sidemenu {
	max-width: 20%;
	background: #fefefe;
	border-right: 1px solid #efefef;
	display: inline-block;
	padding: 3em;
	flex: 1;
}
.content-area {
	width: 80%;
	display: inline-block;
}
.my-menu {
	padding:2em 0;
}
.my-menu li a {
	display: block;
	width: 100%;
	padding: 1em;
	margin-bottom: 0.75em;
	color: #999999;
	text-decoration: none;
	font-family: "Inter",sans-serif;
	border-radius: 12px;
	font-size: 0.85em;
}
.my-menu li a:hover,
.my-menu li a.active {
	background:#efefef;
	border-radius:12px;
	color:#111111;
}
.my-menu li i {
	margin-right:15px;
}
.my-menu li .icon-holder {
	display: inline-block;
	width: 32px;
}
.topmenu {
	padding:0.75em;
	border-bottom:1px solid #efefef;
	box-shadow:1px 0 #efefef;
}
.topmenu .adminMenu li {
	display:inline-block;
	font-size:0.9em;
	margin-right:32px;
}
.topmenu .adminMenu li .icon-holder {
	display: inline-block;
	width:32px;
}
.topmenu .adminMenu li a {
	color:#999999;
	text-decoration: none;
}
.topmenu .adminMenu li a:hover,
.topmenu .adminMenu li a.active {
	color:#111111;
	text-decoration: none;
}
.dashboard-area {
	padding:2.75em;
}
.dashboard-item {
	padding:1em;
	border:1px solid #efefef;
	box-shadow:0 0 10px #efefef;
}
.account-percentage {
	margin:0.5em 0 ;
	background:#999999;
	text-align: center;
}
.inner-percentage {
	display: block;
	background:#29166F;
	color:#ffffff;
	padding: 0.5em 0;
	font-family:"Inter",sans-serif;
}
a.complete-profile {
	font-size:0.9em;
	text-decoration:none;
	color:#999999;
}
a.complete-profile:hover {
	color:#111111;
	font-size:0.9em;
	text-decoration:none;
}
.approval {
	margin:0.85em 0;
}
.approval .icon-dash {
	display:inline-block;
}
.approval .icon-dash i {
	font-size:1.85em;
	vertical-align: middle;
}
.signupDate {
	margin:0.85em 0;
	font-family:"Inter",sans-serif;
	font-size:1.2em;
	font-weight:600;
}
.member-search-area {
	position: relative;
}
.member-search-area input,
.member-list input[type='text'],
.member-list input[type='tel'],
.member-list input[type='email'],
.member-list select,
.member-list textarea {
	padding: 1em 1em 1em 4em;
	width: 100%;
	border: 0;
	background: #efefef;
	border-bottom: 1px solid #999;
	font-family: "Inter",sans-serif;
	font-size: 0.9em;
	border-radius:0;
}
.member-search-area input:focus-visible {
	outline: none;
	border-color: #000000;
	background: #e5e5e5;
}
.member-search-area textarea:focus {
	outline: none;
	border-color: #000000;
	background: #e5e5e5;
}
.member-search-area:before {
	content: "\f002";
	position: absolute;
	left: 1em;
	top: 50%;
	font-family: "Font Awesome 6 Pro";
	width: 32px;
	height: 32px;
	font-weight: 900;
	transform: translateY(-25%);
	color: #777;
}
.member-search-area.payment:before {
	content:"\f2c2";
}
.edit-options li {
	display: inline-block;
	margin: 0 0.5em 0 0;
}
.admin-list .edit-options li a {
    background:#000;
}
.edit-options li a {
    color: #ffffff;
    border: 1px solid #c7c7c7;
    padding: 0.25em;
    min-width: 32px;
    display: block;
    text-align: center;
    height: 32px;
    line-height: 25px;
    border-radius: 5px;
    box-shadow: 0 0 8px #d5d5d5;
}
.edit-options li a:hover {
	color:#999999;
}
a.sidebutton {
	vertical-align: middle;
	margin-bottom:0.7em;
}
a.edit {
	background-color:#29166f ;
}
a.view {
	background-color:#ffd700;
}
a.approve,
a.allow {
	background-color:#1be317;
}
a.disapprove,
a.disallow {
	background-color:#e91111;
}
a.email {
	background-color:#29166f ;
}
table.table td {
	padding: 0.8em;
}
.business-cat,
.business-address-one,
.business-address-two,
.business-city,
.business-zip,
.business-tel,
.business-email,
.email-subject,
.email-message {
	position: relative;
}
.business-cat:before {
	content: "\f0ca";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-address-one:before {
	content: "\f276";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-address-two:before {
	content: "\f276";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-city:before {
	content: "\f64f";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-zip:before {
	content: "\f276";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-tel:before {
	content: "\f095";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.business-email:before {
	content: "\40";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.email-subject:before {
	content: "\f035";
	position: absolute;
	left: 2em;
	bottom: 25%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.email-message:before {
	content: "\f086";
	position: absolute;
	left: 2em;
	bottom: 60%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	transform: translateY(0);
	color: #777;
}
.pdf-view {
	width:100%;
	height:80vh;
}
.register .form-holder .mb-3 {
	position:relative;
}
.form-holder .mb-3 #email_response span {
	position: absolute;
	right: -12px;
	top: 50%;
	background: #ffffff;
	padding: 0.2em 0.3em;
	border-radius: 50%;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
.profile-area .row {
	margin-top:0.75em;
}
.profile-content {
	background: #efefef;
	padding: 1em;
	margin-top: 0.5em;
	border-radius: 12px;
	font-family: "Inter",sans-serif;
}
.profile-content .notset {
	color:#c9c9c9;
}
.business-details {
	min-height:350px;
	background:#999;
	position: relative;
}
.business-logo {
	position:absolute;
	top:50%;
	left:3%;
	height:150px;
	width: 150px;
	text-align: center;
	line-height: 150px;
	transform:translate(0,-50%);
	background: #ffffff;
	box-shadow: 0 0 30px rgba(0,0,0,0.25);
	z-index:99;
}
.default-img {
	font-size: 8em;
	font-family: "Inter", sans-serif;
}
.company-logo {
	vertical-align: middle;
	padding: 1em;
	width: 100%;
	position: relative;
}
.business-details {
	background-size:cover !Important;
	background-position: center !Important;
	background-repeat: no-repeat !Important;
}
a.edit-picture,
a.edit-banner {
	position: absolute;
	text-decoration: none;
	bottom: 5px;
	right: 5px;
	line-height: 0;
	padding: 5px;
	background: #ffffff;
	color: #999;
	text-align: center;
	border-radius:8px;
}
.edit-banner span {
	font-size:0.8em;
}
.pie {
	--p:20;
	--b:22px;
	--c:darkred;
	--w:150px;

	width:var(--w);
	aspect-ratio:1;
	position:relative;
	display:inline-grid;
	margin:5px;
	place-content:center;
	font-size:25px;
	font-weight:bold;
	font-family:sans-serif;
}
.pie:before,
.pie:after {
	content:"";
	position:absolute;
	border-radius:50%;
}
.pie:before {
	inset:0;
	background:
	radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
	conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
	-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
	mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie:after {
	inset:calc(50% - var(--b)/2);
	background:var(--c);
	transform:rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}
.animate {
	animation:p 1s .5s both;
}
.no-round:before {
	background-size:0 0,auto;
}
.no-round:after {
	content:none;
}
@keyframes p {
	from{--p:0}
}
.dashboard-area .col.dashboard-item {
	margin: 0.5%;
	width:24%;
}
.account-setup {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	flex-direction: column;
}
.account-setup .percentage {
    font-size: 3em;
    margin-top: 0.5em;
    color: #090979;
    -webkit-text-stroke: 1px #fff;
    font-family: 'Inter';
}
.account-status {
	display: flex;
	align-items: center;
	justify-content: start;
	flex: 1;
	flex-direction: column;
}
.signupdate {
	display: flex;
	align-items: center;
	justify-content: start;
	flex: 1;
	flex-direction: column;
}
.paymentitem {
	display: flex;
	align-items: center;
	justify-content: start;
	flex: 1;
	flex-direction: column;
}
.qritem {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	flex-direction: column;
}
.qritem p {
    font-family: "Inter", sans-serif;
}
.signupdate p {
    font-family: "Inter", sans-serif;
    font-weight: bold;
    font-size: 2em;
}
.approval .icon-dash {
    font-size: 3em;
    margin-top: 0.3em;
}
@media screen and (max-width:1200px) {
	.my-menu a .icon-holder {
		display:none;
	}
	.sidemenu {
		padding:1em;
	}
	.topmenu a .icon-holder {
		display:none !important;
	}
	.dashboard-area .col.dashboard-item {
		margin: 0.5%;
		width:49%;
	}
}