*{touch-action: pan-x pan-y} /*only allow scroll gestures*/
a { color: unset; text-decoration: none; }
body {
	font-family: "Poppins";
	background: #eef1f6;
	display: flex;
	justify-content: center;
	padding: 0px;
	color: #1d2740;
	opacity: 0;
	animation: pageIn 0.1s ease forwards;
	overflow-x: hidden;
}
html,body {
	height: auto !important;
}
@keyframes pageIn {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
.app {
	width: 100%;
}
.header {
	background: linear-gradient(180deg, #2f68c9 0%, #245bb7 100%);
	color: #fff;
	padding: 8px 0;
}
.header-row {
	display: flex;
	align-items: center;
	justify-content: center;
}
.header-left img {
	max-width: 90px;
	height: auto;
	display: flex;
}
.down_header {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	color: rgb(14, 29, 77);
	width: 100%;
	height: 50px;
	padding: 15px 0;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0 0 3px rgba(0, 0, 0, .2);
	font-size: 20px;
}
.app form {
	padding: 15px;
}
.app form > input {
	display: flex;
	width: 100%;
	outline: none;
	background: transparent;
	border: 0;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	padding: 4px 8px;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: rgb(13, 14, 19);
	margin: 8px 0;
}
.app form input::placeholder {
	color: rgb(13, 14, 19);
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 400;
}
.app form label {
	margin-top: 10px;
	margin-bottom: 5px;
	display: flex;
	color: rgb(86, 92, 119);
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 600;
}
.oem,
.oem > input {
	padding: 0;
	margin: 0;
	display: flex;
	width: 100%;
	outline: none;
	background: transparent;
	border: 0;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	padding: 4px 8px;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: rgb(13, 14, 19);
}
.oem > input {
	box-shadow: 0px 0px 0px 0px !important;
	padding: 0;
}
.oem > input::placeholder {
	color: rgb(86, 92, 119) !important;	
	font-weight: 500 !important;
}
.oem img {
	width: 20px;
	height: 20px;
	display: flex;
	opacity: .5;
}
.product_img_content {
	width: 100%;
	height: 250px;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	border-radius: 6px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
#product_img_content {
	background-image: url('https://coltonconcrete.co.uk/wp-content/uploads/2021/10/placeholder1.jpg');
	background-size: cover;
	background-position: center;
}
.product_img img {
	max-width: 230px;
	max-height: 230px;
	display: flex;
	background-size: cover;
	background-position: center;
	scale: .95;
}
.pic_in {
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 10px;
	background-color: rgb(86, 92, 119);
	padding: 7px;
	border-radius: 6px;
	color: white;
	font-size: 13px;
}
.pic_in span {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}
.pic_in span img {
	max-width: 20px;
}
.contact-option-row{
	width:100%;
	display:flex;
	align-items:center;
	gap:10px;
	margin-bottom:8px;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	padding-right: 10px;
}
.choice-box {
	width:41%;
	border-radius:5px;
	display:flex;
	align-items:center;
	padding:0 12px;
	cursor:pointer;
	user-select:none;
}
.oem-box {
	width: auto !important; 
	border-radius:5px;
	display:flex;
	align-items:center;
	padding:0 12px;
	cursor:pointer;
	user-select:none;
}
.choice-box input{
	display:none;
}
.radio-ui{
	width:16px;
	height:16px;
	border-radius:50%;
	background:#fff;
	border:2px solid #cfd4db;
	position:relative;
	flex:0 0 16px;
	transition:.15s;
}
.choice-box input:checked + .radio-ui{
	border-color:#cfd4db;
	background:#2f63c9;
	box-shadow:0 0 0 3px #fff inset,0 0 0 1px #cfd4db;
}
.choice-box input:checked + .radio-ui:after{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:7px;
	height:7px;
	border-radius:50%;
	background:#2f63c9;
	transform:translate(-50%,-50%);
}
.choice-box input:checked + .radio-ui{
	border-color:#2f63c9;
}
.choice-text{
	margin-left: 10px;
	font-size: 14px;
	font-weight: 500;
	color: #444d59;
	line-height: 1;
	white-space: nowrap;
}
.price-input{
	width: 59%;
	height: 23px;
	border: 1px solid #d8dbe1;
	border-radius: 5px;
	background: #f7f7f9;
	padding: 0 6px;
	font-size: 16px;
	font-weight: 700;
	color: #3d424a;
	outline: none;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.03);
}
.oem-input {
	width: 100% !important;
	height: 23px;
	border: 1px solid #d8dbe1;
	border-radius: 5px;
	background: #f7f7f9;
	padding: 0 6px;
	font-size: 16px;
	font-weight: 700;
	color: #3d424a;
	outline: none;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.03);
}
.whatsapp-btn{
	width:59%;
	height: 36px;
	border:1px solid #5f8e77;
	border-radius:5px;
	background:linear-gradient(180deg,#46755d 0%,#2e503e 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	font-size:15px;
	font-weight:500;
	color:#fff;
	cursor:pointer;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.15);
}
.wa-icon{
	width:26px;
	height:26px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 26px;
}
.wa-icon svg{
	width:26px;
	height:26px;
	display:block;
}
.contact-option-row.row-1 {
	margin-top: 8px;
}
.product-bottom-row{
	width:100%;
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:18px;
}
.product-status-col{
	width:46%;
}
.product-stock-col{
	width:54%;
}
.section-title{
	font-size:14px;
	font-weight:700;
	color:#3f4a59;
	line-height:1.1;
	margin-bottom:10px;
	margin-top: 5px;
}
.status-option{
	display:flex;
	align-items:center;
	gap:10px;
	margin-bottom:12px;
	cursor:pointer;
	user-select:none;
}
.status-option input{
	display:none;
}
.radio-ui{
	width:16px;
	height:16px;
	border-radius:50%;
	background:#fff;
	border:2px solid #cfd4db;
	position:relative;
	flex:0 0 16px;
}
.status-option input:checked + .radio-ui{
	border-color:#cfd4db;
	background:#2f63c9;
	box-shadow:0 0 0 3px #fff inset,0 0 0 1px #cfd4db;
}
.status-text{
	font-size:15px;
	font-weight:500;
	color:#444d59;
	line-height:1;
}
.stock-field{
	width:100%;
	height:26px;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	border-radius:4px;
	background:#f6f6f8;
	display:flex;
	align-items:center;
	overflow:hidden;
	margin-bottom:8px;
}
.stock-label{
	padding-left:10px;
	font-size:14px;
	font-weight:500;
	color:#636b76;
	line-height:1;
	white-space:nowrap;
}
.stock-raf input{
	width:100%;
	height:100%;
	border:none;
	background:transparent;
	text-align:right;
	padding:0 12px 0 8px;
	font-size:18px;
	font-weight:700;
	color:#2f3136;
	outline:none;
}
.stock-plus{
	width:70px;
	height:100%;
	border:none;
	border-left:1px solid #d8dbe1;
	background:linear-gradient(180deg,#e4e4ec 0%,#d7dae0 100%);
	font-size:30px;
	font-weight:400;
	line-height:1;
	color:#737983;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:0;
}
.stock-oda input{
	width:100%;
	height:100%;
	border:none;
	background:transparent;
	padding-right: 12px;
	font-size:15px;
	font-weight:600;
	color:black;
	outline:none;
	font-family: 'Poppins', sans-serif;
}
.stock-oda input::placeholder{
	color:#6b7380;
	opacity:1;
}
.submit-btn{
	width:100%;
	height:40px;
	border:none;
	border-radius:6px;
	background:linear-gradient(180deg,#325fac 0%,#1e3e7a 100%);
	color:#fff;
	font-size:18px;
	font-weight:600;
	cursor:pointer;
	margin-top:5px;
	box-shadow:0 6px 12px rgba(52,101,191,0.25);
	transition:all .2s ease;
	margin-bottom: 80px;
}
.submit-btn:active{
	transform:scale(0.98);
	box-shadow:0 3px 6px rgba(52,101,191,0.2);
}
.success-modal{
	position:fixed;
	inset:0;
	width:100%;
	height:100vh;
	background:rgba(24,31,54,.18);
	display:none;
	align-items:center;
	justify-content:center;
	padding:14px;
	z-index:9999;
	box-sizing:border-box;
}
.success-modal.show{
	display:flex;
}
.success-modal-box{
	width:100%;
	max-width:420px;
	background:#fff;
	border-radius:20px;
	padding:24px 14px 14px;
	box-shadow:0 20px 50px rgba(27,39,79,.22);
	text-align:center;
	border:1px solid #ececf4;
	max-height:calc(100vh - 28px);
	overflow:auto;
}
.success-check{
	width:86px;
	height:86px;
	margin:0 auto 18px;
}
.success-check svg{
	width:100%;
	height:100%;
	display:block;
}
.success-title{
	font-size:22px;
	line-height:1.15;
	font-weight:700;
	color:#1d2e67;
	margin-bottom:12px;
}
.success-text{
	font-size:14px;
	line-height:1.45;
	color:#4f5772;
	margin-bottom:22px;
}
.success-actions{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:8px;
	margin-bottom:20px;
}
.success-action {
	max-height: 100px;
    border-radius: 7px;
    padding: 7px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    text-decoration: none;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 500;
    color: #2f3552;
    box-shadow: 0 4px 12px rgba(23, 32, 71, .08);
}
.success-actions a {
	max-width: 80px;
}
.success-action-icon{
	width:42px;
	height:42px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:8px;
}
.success-action-icon svg{
	width:100%;
	height:100%;
	display:block;
}
.action-message{
	background:#dce8ff;
}
.action-whatsapp{
	background:#79bb86;
	color:#fff;
}
.action-new{
	background:#f7e7c7;
	color:#5b4621;
}
.action-list{
	background:#e8e7f2;
}
.success-home-btn{
	width:100%;
	height:50px;
	border-radius:12px;
	background:linear-gradient(180deg,#4d83df 0%,#315fc2 100%);
	display:flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	color:#fff;
	font-size:16px;
	font-weight:700;
	box-shadow:0 10px 20px rgba(49,95,194,.26);
}
.nav-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	color: #9ca5b7;
}
.nav-item.active {
	color: #2d68c2;
}
.nav-icon {
	font-size: 24px;
	line-height: 1;
}
.custom-toast{
	position:fixed;
	left:50%;
	bottom:90px;
	transform:translateX(-50%) translateY(20px);
	min-width:240px;
	max-width:calc(100% - 32px);
	padding:14px 18px;
	border-radius:14px;
	background:linear-gradient(180deg,#ce2e2e 0%,#b61414 100%);
	color:#fff;
	font-size:14px;
	font-weight:500;
	line-height:1.4;
	text-align:center;
	box-shadow:0 12px 30px rgba(0,0,0,.22);
	opacity:0;
	visibility:hidden;
	transition:all .25s ease;
	z-index:10001;
}
.custom-toast.show{
	opacity:1;
	visibility:visible;
	transform:translateX(-50%) translateY(0);
}
.login-page{
	background:linear-gradient(180deg,#e9f0fb 0%,#f7f9fd 100%);
	min-height:100vh;
}
.login-wrapper{
	width:100%;
	min-height:100vh;
	display:flex;
	align-items:stretch;
	justify-content:center;
	background: #fefcfd;
}
.login-card{
	width:100%;
	min-height:calc(100vh - 42px);
	background:#fff;
	padding:28px 18px 22px;
	box-shadow:0 16px 40px rgba(29,39,64,.10);
	border:1px solid #e8edf5;
	display:flex;
	flex-direction:column;
	justify-content:center;
}
.login-top{
	text-align:center;
	margin-bottom:24px;
}
.login-logo{
	width:74px;
	height:74px;
	border-radius:22px;
	margin:0 auto 16px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(180deg,#4a7ed5 0%,#3465bf 100%);
	color:#fff;
	font-size:30px;
	font-weight:700;
	box-shadow:0 12px 24px rgba(52,101,191,.20);
}
.login-top h1{
	margin:0 0 6px;
	font-size:24px;
	line-height:1.2;
	font-weight:700;
	color:#1d2740;
}
.login-top p{
	margin:0;
	font-size:13px;
	color:#738096;
}
.login-alert{
	background:#fef2f2;
	color:#b91c1c;
	border:1px solid #fecaca;
	border-radius:14px;
	padding:12px 14px;
	font-size:13px;
	font-weight:500;
	margin-bottom:14px;
	text-align:center;
}
.login-form{
	display:flex;
	flex-direction:column;
	gap:14px;
}
.input-card{
	width:100%;
	min-height:58px;
	display:flex;
	align-items:center;
	background:#f8fafc;
	border:1px solid #e5ebf3;
	border-radius:18px;
	padding:0 14px;
	transition:.2s ease;
}
.input-card:focus-within{
	background:#fff;
	border-color:#4a7ed5;
	box-shadow:0 0 0 4px rgba(74,126,213,.10);
}
.input-icon{
	width:42px;
	height:42px;
	border-radius:14px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(180deg,#eef4ff 0%,#e3ecff 100%);
	font-size:18px;
	flex:0 0 42px;
	margin-right:12px;
}
.input-text{
	flex:1;
}
.input-text input{
	width:100%;
	height:54px;
	border:none;
	outline:none;
	background:transparent;
	font-size:15px;
	color:#1d2740;
	padding:0;
}
.input-text input::placeholder{
	color:#9aa6b8;
}
.submit-btn.login-btn{
	width:100%;
	height:54px;
	border:none;
	border-radius:16px;
	background:linear-gradient(180deg,#4a7ed5 0%,#3465bf 100%);
	color:#fff;
	font-size:16px;
	font-weight:700;
	cursor:pointer;
	margin-top:6px;
	box-shadow:0 10px 22px rgba(52,101,191,.22);
	transition:.2s ease;
}
.submit-btn.login-btn:active{
	transform:scale(.985);
}
.product-bottom-row{
	display:flex;
	gap:14px;
	align-items:flex-start;
}
.product-status-col,
.product-stock-col{
	width:50%;
}
.section-title{
	font-size:15px;
	font-weight:700;
	margin-bottom:10px;
	color:#4d5670;
}
.status-option{
	display:flex;
	align-items:center;
	gap:8px;
	margin-bottom:10px;
}
.stock-field{
	display:flex;
	align-items:center;
	gap:8px;
	margin-bottom:10px;
}
.stock-label{
	min-width:34px;
	font-size:14px;
	color:#4d5670;
}
.stock-field input{
	flex:1;
}
.stock-add-btn{
	height:34px;
	padding:0 12px;
	border:none;
	border-radius:8px;
	background:#eef2f7;
	color:#364152;
	font-size:14px;
	font-weight:600;
	margin-bottom:10px;
}
.remove-raf-btn{
	height:34px;
	border:none;
	border-radius:8px;
	background:#f1f3f6;
	font-size:13px;
	color: red;
	font-family: 'Poppins', sans-serif;
	font-weight: bold;
}
.supplier-fields{
	margin-top:16px;
}
.supplier-field{
	margin-bottom:14px;
	display: flex;
	gap: 5px;
	box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, .1);
	align-items: center;
	padding-right: 10px;
}
.supplier-field label{
	display:block;
	font-size:13px;
	font-weight:600;
	color:#4d5670;
	margin-bottom:6px;
	padding-left: 5px;
	margin-top: 5px !important;
}
.supplier-field input,
.stock-row input {
	width: 100% !important;
    height: 23px;
    border: 1px solid #d8dbe1;
    border-radius: 5px;
    background: #f7f7f9;
    padding: 0 6px;
    font-size: 16px;
    font-weight: 700;
    color: #3d424a;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .03);
}
.supplier-field{
	display:flex;
	align-items:center;
	gap:10px;
}

.supplier-field label{
	flex:0 0 130px;
	white-space:nowrap;
}

.supplier-field input{
	flex:1;
	width:100%;
}
.stock-row {
	padding-right: 10px !important;
}
.product-bottom-row{
	flex-direction:row !important;
	align-items:flex-start !important;
}
.product-status-col,
.product-stock-col{
	width:50% !important;
}
.adet-plus{
	width:20px;
	height:20px;
	border:none;
	border-radius:6px;
	background:#2f63c9;
	color:#fff;
	font-weight:700;
	font-size:16px;
	margin-right: 4px;
}
.mobile-app {
  width: 100%;
  max-width: 480px;
  min-height: 100vh;
  margin: 0 auto;
  position: relative;
  background: transparent;
  padding-bottom: 95px;
}
.profile-topbar {
  background: linear-gradient(180deg, #0f59c7 0 120px, #eef3fb 120px 100%);
  height: auto;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
}
.topbar-back,
.topbar-bell {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.topbar-back svg,
.topbar-bell svg {
  width: 40px;
  height: 40px;
}
.topbar-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.topbar-pin {
  font-size: 26px;
  line-height: 1;
}
.topbar-bell {
  position: relative;
}
.bell-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 30px;
  background: #ff6b57;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.profile-content {
  padding: 0 15px 0px !important;
}
.company-head {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin-top: 10px;
}
.company-avatar-box {
  width: 78px;
  height: 78px;
  border-radius: 100%;
  overflow: hidden;
  position: relative;
  background: #eff4fb;
  cursor: pointer;
}
.company-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.avatar-edit-layer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(17, 39, 94, 0.72);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  text-align: center;
  padding: 7px 4px;
}
.company-main {
  flex: 1;
  min-width: 0;
}
.company-name-row {
  display: flex;
  flex-direction: column;
}
.company-name-wrap{
	display:flex !important;
	align-items:center !important;
	gap:8px;
	width:100% !important;
}
.company-name-edit{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:center;
}
.company-name-wrap h1{
	margin:0;
	padding:0 !important;
	font-size:18px;
	font-weight:800;
	color:#1b2431;
	line-height:1.25;
	text-transform:uppercase;
	word-break:break-word;
	overflow-wrap:anywhere;
	display:block;
}
.company-name-edit{
	flex:0 0 28px;
	width:28px;
	height:28px;
	display:flex;
	align-items:center;
	justify-content:center;
}
.company-name-edit svg{
	width:18px;
	height:18px;
}
.company-name-edit {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #edf4ff;
  color: #135fd1;
  flex: 0 0 34px;
  cursor: pointer;
}
.company-name-edit svg {
  width: 18px;
  height: 18px;
}
.company-name-edit-box {
  display: none;
  align-items: center;
  gap: 8px;
  background: #f7faff;
  border: 1px solid #dbe7fb;
  border-radius: 16px;
  padding: 8px;
}
.company-name-edit-box.active {
  display: flex;
}
.company-name-edit-box input {
  width: 100%;
  height: 35px;
  border: none;
  outline: none;
  background: #fff;
  border-radius: 12px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 700;
  color: #1b2431;
  box-shadow: inset 0 0 0 1px #dbe7fb;
}
.name-save-btn {
  width: 42px;
  height: 35px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(180deg, #2d7cff 0, #1458c7 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
  cursor: pointer;
}
.company-location-wrap{
	width:100%;
}
.company-location-row{
	display:flex;
	align-items:center;
}
.company-location{
	display:flex;
	align-items:center;
	font-weight:700;
	color:#6b7280;
}
#companyCityText {
	margin-right: 5px;
}
.location-pin-icon{
	width:18px;
	height:18px;
	position: relative;
	top: 2px;
}
.company-location-edit {
    width: 25px;
    height: 25px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #edf4ff;
    color: #135fd1;
    cursor: pointer;
	position: relative;
	top: 2px;
	margin-left: 10px;
}
.company-location-edit svg {
	width: 18px;
	height: 18px;
}
.city-modal{
	position:fixed;
	inset:0;
	display:none;
	z-index:9999;
}
.city-modal.active{
	display:block;
}
.city-overlay{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.4);
}
.city-box{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:80%;
	height:80%;
	background:#fff;
	border-radius:20px;
	padding:15px;
	display:flex;
	flex-direction:column;
}
#citySearch{
	height:45px;
	border:1px solid #ddd;
	border-radius:12px;
	padding:0 12px;
	margin-bottom:10px;
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
}
.city-list{
	flex:1;
	overflow:auto;
}
.city-item{
	padding:12px;
	border-radius:10px;
	cursor:pointer;
}
.city-item:hover{
	background:#f1f5f9;
}
.name-save-btn svg {
  width: 20px;
  height: 20px;
}
.company-location {
  font-size: 13px;
  font-weight: 500;
  color: #4b5563;
  display: flex;
  align-items: center;
  line-height: 0;
}
.company-location svg {
	width: 20px;
	height: 20px;
}
.company-stars-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.company-stars {
  font-size: 17px;
  letter-spacing: 1px;
  color: #ffbf2d;
}
.verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  position: relative;
  top: 2px;
}
.verified-badge span {
	background-color: #21ad44;
	border-radius: 100%;
	width: 17px;
	height: 17px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 10px;
	color: white;
	font-family: 'Poppins', sans-serif;
	font-weight: 100;
	line-height: 0;
}
.status-row {
  margin-top: 16px;
  padding: 7px 14px;
  border-radius: 6px;
  box-shadow: 0px 0px 3px .5px rgba(0, 0, 0, .1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  flex-wrap: wrap;
}
.status-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #1f2937;
  font-family: 'Poppins', sans-serif;
}
.status-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #c7d2e3;
  margin-right: 5px;
}
.status-dot.active {
  background: #30c266;
  box-shadow: 0 0 0 4px rgba(48, 194, 102, 0.16);
}
.status-text {
  font-size: 12px;
  color: #6b7280;
  font-weight: 500;
  font-family: 'Poppins', sans-serif;
}
.stats-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.stat-box {
  border-radius: 6px;
  padding: 5px 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0px 0px 3px .5px rgba(0, 0, 0, .1);
}
.stat-box-full {
  grid-column: 1/-1;
  justify-content: center;
  align-items: center;
}
.stat-box-full {
	gap: 3px !important;
}
.stat-box-full .stat-value {
	font-size: 16px;
}
.stat-box-full svg {
	width: 40px !important;
	height: 40px !important;
	margin: auto 0 !important;
	padding: 0 !important;
	position: relative;
	top: 2px;
}
.stat-icon {
  line-height: 1;
  display: flex;
  margin: auto 0;
}
.stat-icon svg {
	width: 32px;
	height: 32px;
	fill: rgb(42, 34, 121) !important;
}
.stat-content {
  display: flex;
  flex-direction: column;
}
.stat-content span {
	margin-right: 2px;
}
.stat-title {
  font-size: 12px;
  font-weight: 600;
  color: #667085;
  font-family: 'Poppins', sans-serif;
}
.stat-value {
  font-size: 15px;
  font-weight: 700;
  color: #1b2431;
  font-family: 'Poppins', sans-serif;
}
.section-block {
  margin-top: 14px;
}
.section-title {
  padding: 0 4px 6px;
  font-size: 18px;
  font-weight: 700;
  color: #1b2431e0;
  font-family: 'Poppins', sans-serif;
}
.badge-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.badge-item {
  border-radius: 6px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}
.badge-item-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.badge-icon {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.22);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex: 0 0 38px;
}
.badge-texts {
  min-width: 0;
}
.badge-name {
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.15;
  overflow: hidden !important;
  font-family: 'Poppins', sans-serif;
}
.badge-sub {
  font-size: 11px;
  font-weight: 700;
  opacity: 0.95;
  margin-top: 4px;
}
.badge-check {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: #1f7a35;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 800;
  flex: 0 0 26px;
}
.badge-blue {
  background: linear-gradient(135deg, #0d73f0 0, #004fc1 100%);
}
.badge-gold {
  background: linear-gradient(135deg, #f3b73a 0, #d89200 100%);
}
.badge-purple {
  background: linear-gradient(135deg, #8878ff 0, #5b46d8 100%);
}
.badge-gray {
  background: linear-gradient(135deg, #f3f4f6 0, #e5e7eb 100%);
  color: #374151;
}
.badge-gray .badge-check {
  background: #fff;
  color: #1f7a35;
}
.empty-badge-box {
  grid-column: 1/-1;
  background: #fff;
  border: 1px dashed #d7e3f6;
  color: #6b7280;
  padding: 20px;
  border-radius: 18px;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
}
.section-actions {
  margin-top: 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.section-actions a {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
}
.section-actions a:first-child {
	font-size: 20px;
}
.section-actions a:first-child span {
	font-size: 30px;
	font-family: 'Poppins', sans-serif;
	font-weight: 500;
	margin-right: 10px;
}
.main-action-btn {
  width: 100%;
  height: 50px;
  border-radius: 6px;
  background: linear-gradient(180deg, #2260c5 0, #104396 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px rgba(20, 88, 199, 0.22);
}
.secondary-btn {
  margin-top: 2px;
  margin-bottom: 10px;
  font-size: 16px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
.white-action-btn {
  min-height: 50px;
  border-radius: 6px;
  color: #1b2431;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 17px;
  font-weight: 800;
  box-shadow: 0px 0px 3px .5px rgba(0, 0, 0, .1);
}
.white-action-btn span {
	display: flex;
	align-items: center;
	gap: 5px;
}
.white-action-btn svg {
	width: 30px;
	height: 30px;
	margin: auto 0
	.doc-btn {
		display: flex;
		justify-content: center;
	};
}
.bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: 480px;
  height: 78px;
  backdrop-filter: blur(12px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0px 0px 3px .5px rgba(0, 0, 0, .1);
}
.bottom-nav a svg {
	width: 35px;
	height: 35px;
}
.bottom-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #7a8699;
  font-size: 12px;
  font-weight: 700;
  position: relative;
}
.bottom-icon {
  font-size: 22px;
  line-height: 1;
  position: relative;
}
.bottom-text {
  font-size: 12px;
  font-weight: 700;
}
.badge-dot-wrap {
  position: relative;
}
.mini-badge {
  position: absolute;
  top: -7px;
  right: -10px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 20px;
  background: #ff6b57;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.toast-box {
  position: fixed;
  left: 50%;
  bottom: 95px;
  transform: translateX(-50%) translateY(20px);
  width: calc(100% - 28px);
  max-width: 420px;
  background: linear-gradient(180deg, #1ad62a 0, #12d322 100%);
  color: #fff;
  border-radius: 6px;
  padding: 14px 16px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.25s;
  z-index: 99;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
}
.toast-box.show {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.header-row{
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
	min-height:72px;
	padding:0 16px;
}
.header-left{
	display:flex;
	align-items:center;
	gap:12px;
	width:100%;
	position:relative;
	justify-content:center;
}
.header-back-btn{
	width:38px;
	height:38px;
	min-width:38px;
	border-radius:12px;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	text-decoration:none;
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	background:rgba(255,255,255,.12);
}
.header-back-btn svg{
	width:22px;
	height:22px;
}
.logo{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
}
html.modal-open,
body.modal-open{
	overflow:hidden !important;
}
.doc-btn {
	display: flex;
	justify-content: center;
	align-items: center;
}
@media (min-width:481px){
	.mobile-app{box-shadow:0 0 0 1px rgba(19,95,209,.06);}
}