body {
    padding-top: 90px;
}


.panel-login {
	border-color: #ccc;
	-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.2);
}
.panel-login>.panel-heading {
	color: #00415d;
	background-color: #fff;
	border-color: #fff;
	text-align:center;
}
.panel-login>.panel-heading a{
	text-decoration: none;
	color: #666;
	font-weight: bold;
	font-size: 15px;
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	transition: all 0.1s linear;
}
.panel-login>.panel-heading a.active{
	color: #029f5b;
	font-size: 18px;
}
.panel-login>.panel-heading hr{
	margin-top: 10px;
	margin-bottom: 0px;
	clear: both;
	border: 0;
	height: 1px;
	background-image: -webkit-linear-gradient(left,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.15),rgba(0, 0, 0, 0));
	background-image: -moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
	background-image: -ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
	background-image: -o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
}
.panel-login input[type="text"],.panel-login input[type="email"],.panel-login input[type="password"] {
	height: 45px;
	border: 1px solid #ddd;
	font-size: 16px;
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	transition: all 0.1s linear;
}
.panel-login input:hover,
.panel-login input:focus {
	outline:none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border-color: #ccc;
}
.btn-login {
	background-color: #59B2E0;
	outline: none;
	color: #fff;
	font-size: 14px;
	height: auto;
	font-weight: normal;
	padding: 14px 0;
	text-transform: uppercase;
	border-color: #59B2E6;
}
.btn-login:hover,
.btn-login:focus {
	color: #fff;
	background-color: #53A3CD;
	border-color: #53A3CD;
}

.btn-register {
	background-color: #1CB94E;
	outline: none;
	color: #fff;
	font-size: 14px;
	height: auto;
	font-weight: normal;
	padding: 14px 0;
	text-transform: uppercase;
	border-color: #1CB94A;
}

.btn-join {
	background-color: #ffc72c;
	outline: none;
	color: #353434;
	font-size: 14px;
	height: auto;
	font-weight: bold;
	padding: 14px 0;
	text-transform: uppercase;
	border-color: #ffd98e #ffbe3d #de9300;
}

.btn-forgot {
background-color: #ffc72c;
	outline: none;
	color: #565656;
	font-size: 14px;
	height: auto;
	font-weight: normal;
	border-radius: 3px;
	padding: 8px 0px;
	text-transform: uppercase;
	border-color: #ffd98e #ffbe3d #de9300;
}



.btn-register:hover,
.btn-register:focus {
	color: #fff;
	background-color: #1CA347;
	border-color: #1CA347;
}

.btn-join:hover,
.btn-join:focus {
	color: #fff;
	background-color: #fb0;
	border-color: #000;
}

.btn-forgot:hover,
.btn-forgot:focus {
	color: #fff;
	background-color: #1CA347;
	border-color: #1CA347;
}


/* =========================================================================
   gp-ui.css  —  GreenPay global professional + responsive UI layer
   Appended to style.css & greenpay.css so it overrides the legacy look
   site-wide. Visual-only (colors, radius, borders, spacing, focus) — no
   layout/position/float changes, and body font-family is left untouched so
   the Arabic typography keeps working.
   ========================================================================= */
:root{
  --gpu-green:#1d9e75; --gpu-green-d:#0f6e56; --gpu-green-l:#e8f7f1;
  --gpu-ink:#1f2937; --gpu-muted:#6b7280; --gpu-line:#e6e8eb;
  --gpu-radius:14px; --gpu-radius-lg:18px;
}
html{-webkit-text-size-adjust:100%}
body{
  -webkit-font-smoothing:antialiased !important;
  text-rendering:optimizeLegibility;
  background:#f4f6f8 !important; color:var(--gpu-ink) !important;
}

/* ---------- buttons ---------- */
.btn,.btn-register,.btn-join,.btn-primary,.btn-success,button.btn,
input[type="submit"],input[type="button"].btn{
  border-radius:var(--gpu-radius) !important; font-weight:700 !important;
  transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease !important;
  padding:11px 18px !important;
}
.btn-register,.btn-primary,.btn-success,#login-submit{
  background:var(--gpu-green) !important; color:#fff !important; border:0 !important;
  box-shadow:0 6px 16px rgba(29,158,117,.28) !important;
}
.btn-register:hover,.btn-primary:hover,.btn-success:hover,#login-submit:hover{
  transform:translateY(-1px); box-shadow:0 10px 22px rgba(29,158,117,.36) !important;
}
.btn-join{background:#fff !important; color:var(--gpu-green-d) !important; border:1.5px solid var(--gpu-green) !important}
.btn-join:hover{background:var(--gpu-green-l) !important}

/* ---------- form fields ---------- */
.form-control,input[type="text"],input[type="password"],input[type="email"],
input[type="number"],input[type="tel"],input[type="search"],select,textarea{
  border-radius:var(--gpu-radius) !important; border:1.5px solid var(--gpu-line) !important;
  padding:11px 14px !important; font-size:15px !important; background:#fff !important;
  color:var(--gpu-ink) !important; box-shadow:none !important; height:auto !important;
  transition:border-color .12s ease, box-shadow .12s ease !important;
}
.form-control:focus,input:focus,select:focus,textarea:focus{
  border-color:var(--gpu-green) !important; box-shadow:0 0 0 3px rgba(29,158,117,.15) !important; outline:none !important;
}
::placeholder{color:#9aa1ab !important; opacity:1}

/* ---------- panels / cards ---------- */
.panel,.panel-login,.card,.w3-card,.w3-card-4,.w3-card-2{
  border-radius:var(--gpu-radius-lg) !important; border:1px solid var(--gpu-line) !important;
  box-shadow:0 12px 30px rgba(16,24,40,.08) !important; background:#fff !important;
}
.panel-heading{background:#fff !important; border-bottom:1px solid var(--gpu-line) !important; border-radius:var(--gpu-radius-lg) var(--gpu-radius-lg) 0 0 !important}
.panel-login a,.panel-heading a{color:var(--gpu-green-d) !important; font-weight:800 !important; text-decoration:none !important}

/* ---------- links ---------- */
a{transition:color .12s ease}
a:hover{color:var(--gpu-green-d) !important}

/* ---------- tables ---------- */
.table,.w3-table,.w3-table-all{border-radius:var(--gpu-radius) !important; overflow:hidden}
.table>thead>tr>th,.w3-table th,.w3-table-all th{background:var(--gpu-green-l) !important; color:var(--gpu-green-d) !important; border:0 !important; font-weight:800 !important}
.table>tbody>tr>td,.w3-table td{border-color:var(--gpu-line) !important}
.table-striped>tbody>tr:nth-child(odd){background:#fafbfc !important}

/* ---------- w3 nav bar ---------- */
.w3-bar .w3-bar-item.w3-button:hover{background:var(--gpu-green-l) !important; color:var(--gpu-green-d) !important}
.w3-green,.w3-btn.w3-green{background:var(--gpu-green) !important}

/* ---------- responsive ---------- */
img{max-width:100%; height:auto}
@media (max-width:600px){
  .container{padding-left:14px !important; padding-right:14px !important}
  .panel-login{margin-left:0 !important; margin-right:0 !important}
  .table-responsive,.w3-responsive{overflow-x:auto; -webkit-overflow-scrolling:touch}
  .btn,.btn-register,.btn-join{width:100%; }
}
@media (min-width:1200px){
  .container{max-width:1140px}
}