/* Parking Public Theme UI layer for Parking MIS Portal */

:root{
  --pp-bg:#0b1220;
  --pp-surface:#0f1a2d;
  --pp-surface-2:#12213a;
  --pp-border:rgba(255,255,255,.10);
  --pp-text:#eaf0ff;
  --pp-text-2:rgba(234,240,255,.78);
  --pp-text-3:rgba(234,240,255,.60);
  --pp-accent:#6ee7ff;
  --pp-accent-2:#a78bfa;
  --pp-danger:#fb7185;
  --pp-ok:#34d399;
  --pp-shadow:0 10px 30px rgba(0,0,0,.35);
  --pp-radius:16px;
  --pp-radius-sm:12px;
  --pp-focus:0 0 0 3px rgba(110,231,255,.22);
}

/* Shell */
.parking-portal{
  padding:24px 0 48px;
}

.portal-shell{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid var(--pp-border);
  border-radius:var(--pp-radius);
  box-shadow:var(--pp-shadow);
  overflow:hidden;
}

.portal-shell__header{
  padding:22px 20px;
  border-bottom:1px solid var(--pp-border);
  background:linear-gradient(135deg, rgba(110,231,255,.18), rgba(167,139,250,.10));
}

.portal-title{
  margin:0;
  font-size:22px;
  line-height:1.2;
  letter-spacing:.2px;
}

.portal-subtitle{
  margin:8px 0 0;
  color:var(--pp-text-2);
  font-size:14px;
}

.portal-shell__body{
  padding:18px;
}

/* Plugin portal container */
#pmis-portal{
  color:var(--pp-text);
}

/* Plugin base cards */
#pmis-portal .pmis-card{
  background:var(--pp-surface);
  border:1px solid var(--pp-border);
  border-radius:var(--pp-radius-sm);
  box-shadow:0 8px 18px rgba(0,0,0,.22);
}

#pmis-portal .pmis-card-header{
  padding:14px 14px 10px;
  border-bottom:1px solid var(--pp-border);
}

#pmis-portal .pmis-card-header h2{
  margin:0;
  font-size:16px;
}

#pmis-portal .pmis-card-body{
  padding:14px;
}

/* Nav */
#pmis-portal .pmis-portal-nav{
  gap:10px;
}

#pmis-portal .pmis-portal-nav button{
  background:rgba(255,255,255,.06);
  border:1px solid var(--pp-border);
  color:var(--pp-text);
  padding:10px 12px;
  border-radius:12px;
  font-weight:600;
  cursor:pointer;
  transition:transform .08s ease, background .12s ease, border-color .12s ease;
}

#pmis-portal .pmis-portal-nav button:hover{
  background:rgba(255,255,255,.10);
}

#pmis-portal .pmis-portal-nav button:active{
  transform:translateY(1px);
}

#pmis-portal .pmis-portal-nav button[aria-current="page"],
#pmis-portal .pmis-portal-nav button.is-active{
  background:linear-gradient(135deg, rgba(110,231,255,.26), rgba(167,139,250,.18));
  border-color:rgba(110,231,255,.40);
}

/* Forms */
#pmis-portal input,
#pmis-portal select,
#pmis-portal textarea{
  width:100%;
  background:rgba(255,255,255,.05);
  border:1px solid var(--pp-border);
  color:var(--pp-text);
  padding:10px 12px;
  border-radius:12px;
  outline:none;
}

#pmis-portal input:focus,
#pmis-portal select:focus,
#pmis-portal textarea:focus{
  box-shadow:var(--pp-focus);
  border-color:rgba(110,231,255,.45);
}

#pmis-portal label{
  color:var(--pp-text-2);
  font-size:12px;
  font-weight:600;
}

#pmis-portal .pmis-row{
  gap:10px;
}

/* Buttons */
#pmis-portal button{
  border-radius:12px;
  padding:10px 12px;
  border:1px solid var(--pp-border);
  background:rgba(255,255,255,.06);
  color:var(--pp-text);
  font-weight:700;
  cursor:pointer;
}

#pmis-portal button:hover{
  background:rgba(255,255,255,.10);
}

#pmis-portal button.primary,
#pmis-portal .pmis-btn-primary{
  background:linear-gradient(135deg, rgba(110,231,255,.32), rgba(167,139,250,.22));
  border-color:rgba(110,231,255,.45);
}

#pmis-portal button.danger,
#pmis-portal .pmis-btn-danger{
  background:rgba(251,113,133,.16);
  border-color:rgba(251,113,133,.45);
}

#pmis-portal button:disabled{
  opacity:.55;
  cursor:not-allowed;
}

/* Tables */
#pmis-portal table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border:1px solid var(--pp-border);
  border-radius:14px;
}

#pmis-portal th,
#pmis-portal td{
  padding:10px 10px;
  border-bottom:1px solid var(--pp-border);
  font-size:13px;
  color:var(--pp-text-2);
}

#pmis-portal th{
  text-align:left;
  font-size:12px;
  letter-spacing:.3px;
  text-transform:uppercase;
  color:var(--pp-text-3);
  background:rgba(255,255,255,.04);
}

#pmis-portal tr:last-child td{
  border-bottom:none;
}

/* Alerts */
.pmis-alert{
  border-radius:14px;
  border:1px solid var(--pp-border);
  padding:12px 12px;
  background:rgba(255,255,255,.05);
  color:var(--pp-text);
}

.pmis-alert-error{
  border-color:rgba(251,113,133,.45);
  background:rgba(251,113,133,.12);
}

.pmis-alert-success{
  border-color:rgba(52,211,153,.45);
  background:rgba(52,211,153,.12);
}

/* Mobile tweaks */
@media (max-width: 640px){
  .portal-shell__body{ padding:14px; }
  #pmis-portal .pmis-portal-nav{ flex-wrap:wrap; }
  #pmis-portal .pmis-row{ grid-template-columns:1fr; }
}
