/* Front-end styles for PDS Geo Attendance Pro */

.pds-container{
  min-height:70vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px 12px;
  background:radial-gradient(circle at top,#020617 0,#020617 55%,#0f172a 100%);
  color:#e5e7eb;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.pds-card,
.pds-dashboard-card{
  background:#020617;
  border-radius:24px;
  padding:24px 22px 26px;
  width:100%;
  max-width:420px;
  box-shadow:0 24px 50px rgba(0,0,0,0.75);
  border:1px solid #1f2937;
}
.pds-logo img,
.pds-logo-small img{
  max-height:50px;
}
.pds-logo{
  text-align:center;
  margin-bottom:10px;
}
.pds-logo-small{
  margin-right:10px;
}
.pds-title{
  text-align:center;
  margin-bottom:20px;
  font-size:20px;
  font-weight:600;
}
.pds-field{
  margin-bottom:14px;
}
.pds-field label{
  display:block;
  font-size:13px;
  margin-bottom:4px;
  color:#9ca3af;
}
.pds-field input{
  width:100%;
  padding:9px 10px;
  border-radius:10px;
  border:1px solid #1f2937;
  background:#020617;
  color:#e5e7eb;
}
.pds-btn-primary,
.pds-btn-secondary{
  border:none;
  border-radius:20px;
  padding:10px 16px;
  font-size:15px;
  cursor:pointer;
  font-weight:600;
}
.pds-btn-primary{
  background:#22c55e;
  color:#021014;
  width:100%;
}
.pds-btn-primary:hover{
  filter:brightness(1.05);
}
.pds-btn-secondary{
  background:#fb923c;
  color:#021014;
}
.pds-message{
  margin-bottom:10px;
  min-height:18px;
  font-size:13px;
}
.pds-message.error{color:#f87171;}
.pds-message.success{color:#4ade80;}

.pds-dashboard-header{
  margin-bottom:16px;
}
.pds-emp-top{
  display:flex;
  align-items:center;
  gap:12px;
}
.pds-avatar{
  width:54px;
  height:54px;
  border-radius:999px;
  overflow:hidden;
  border:2px solid #22c55e;
  flex-shrink:0;
}
.pds-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.pds-emp-name-wrap{
  flex:1;
}
.pds-emp-name{
  font-size:18px;
  font-weight:600;
}
.pds-logout-link{
  font-size:12px;
  margin-left:10px;
  color:#60a5fa;
  text-decoration:none;
}
.pds-logout-link:hover{
  text-decoration:underline;
}
.pds-emp-sub{
  font-size:13px;
  color:#9ca3af;
}
.pds-stats-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:8px 0 14px;
}
.pds-stat-box{
  background:#020617;
  border-radius:14px;
  padding:9px 10px;
  border:1px solid #1f2937;
}
.pds-stat-box .label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#9ca3af;
}
.pds-stat-box .value{
  font-size:16px;
  margin-top:4px;
}
.pds-buttons-row{
  display:flex;
  gap:10px;
  margin:4px 0 14px;
}
.pds-buttons-row .pds-btn-primary,
.pds-buttons-row .pds-btn-secondary{
  flex:1;
}
.pds-section-title{
  margin:8px 0 6px;
  font-size:14px;
}
.pds-punch-list{
  list-style:none;
  margin:0;
  padding:0;
  font-size:13px;
}
.pds-punch-list li{
  display:flex;
  justify-content:space-between;
  padding:4px 0;
  border-bottom:1px dashed #111827;
}
.pds-punch-list .type.in{color:#4ade80;}
.pds-punch-list .type.out{color:#fb923c;}

@media (min-width:640px){
  .pds-stats-row{grid-template-columns:repeat(4,minmax(0,1fr));}
}

/* Manager Dashboard Ultra Modern Styles */

.pds-mgr-wrap{
  min-height:80vh;
  padding:24px 14px 40px;
  background:radial-gradient(circle at top,#020617 0,#020617 55%,#020617 100%);
  color:#e5e7eb;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.pds-mgr-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  margin-bottom:18px;
}
.pds-mgr-header h1{
  font-size:22px;
  margin:0 0 4px;
}
.pds-mgr-header p{
  margin:0;
  font-size:13px;
  color:#9ca3af;
}
.pds-mgr-meta span{
  display:block;
  font-size:12px;
  color:#9ca3af;
  text-align:right;
}
.pds-mgr-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:16px;
}
.pds-mgr-card{
  background:linear-gradient(145deg,#020617,#020617 60%,#020617);
  border-radius:20px;
  padding:14px 14px 16px;
  border:1px solid #1f2937;
  box-shadow:0 18px 40px rgba(0,0,0,0.6);
  flex:1;
  min-width:240px;
}
.pds-mgr-card.wide{
  flex:2;
}
.pds-mgr-card .title{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#9ca3af;
}
.pds-mgr-card.stat .value{
  margin-top:6px;
  font-size:28px;
  font-weight:700;
}
.pds-mgr-card .card-header h2{
  font-size:14px;
  margin:0 0 8px;
}
.pds-mgr-emp-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:10px;
}
.pds-mgr-emp-card{
  background:radial-gradient(circle at top,#020617,#020617 70%);
  border-radius:16px;
  padding:10px 10px 12px;
  border:1px solid #111827;
}
.pds-mgr-emp-card .top{
  display:flex;
  gap:10px;
  align-items:center;
}
.pds-mgr-emp-card .photo{
  width:40px;
  height:40px;
  border-radius:999px;
  overflow:hidden;
  background:#020617;
  border:2px solid #22c55e33;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.pds-mgr-emp-card .photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.pds-mgr-emp-card .photo .initial{
  font-size:16px;
  font-weight:600;
}
.pds-mgr-emp-card .info .name{
  font-size:14px;
  font-weight:600;
}
.pds-mgr-emp-card .info .status{
  font-size:11px;
  margin-top:2px;
}
.pds-mgr-emp-card .info .time{
  font-size:11px;
  margin-top:2px;
  color:#9ca3af;
}
.badge-green{color:#22c55e;}
.badge-red{color:#fb7185;}
.badge-yellow{color:#facc15;}
.badge-gray{color:#9ca3af;}

.pds-mgr-activity{
  max-height:260px;
  overflow:auto;
}
.activity-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:6px 0;
  border-bottom:1px solid #020617;
  font-size:13px;
}
.activity-item .who{width:35%;font-weight:500;}
.activity-item .what{width:35%;color:#9ca3af;}
.activity-item .when{width:20%;text-align:right;color:#9ca3af;}

.pds-mgr-locations{
  max-height:260px;
  overflow:auto;
  font-size:13px;
}
.loc-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:6px 0;
  border-bottom:1px solid #020617;
}
.loc-item .who{width:45%;}
.loc-item .when{width:25%;color:#9ca3af;font-size:12px;}
.loc-item .map a{
  font-size:12px;
  color:#38bdf8;
  text-decoration:none;
}
.loc-item .map a:hover{text-decoration:underline;}

@media (max-width:640px){
  .pds-mgr-header{flex-direction:column;align-items:flex-start;}
  .pds-mgr-meta span{text-align:left;}
}