/* ============================================================
   CPAG public complaint page (public_index.php)
   v2 redesign
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@600;700;800&family=Inter:wght@400;500;600&display=swap');

body{
  background: #f2f4f8;
  font-family: 'Inter', 'Segoe UI', sans-serif;
  color: #1c2434;
}

h3, h4{ font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; }

.navbar{
  background: #0d1f3c !important;
  border-bottom: 3px solid #e8a824;
  min-height: 58px;
}
.navbar-brand{
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  letter-spacing: .04em;
}

.card{
  border: 1px solid #e3e8f0;
  border-radius: 16px;
  box-shadow: 0 4px 14px rgba(13,31,60,.08);
}

.form-control, .form-select{
  border-radius: 11px;
  border-color: #dfe5ee;
  padding: 11px 13px;
  font-size: 15px;
}
.form-control:focus, .form-select:focus{
  border-color: #1a56c4;
  box-shadow: 0 0 0 .2rem rgba(26,86,196,.13);
}
.form-label{ font-weight: 600; font-size: 13.5px; }

.btn{
  border-radius: 11px;
  font-weight: 700;
  padding: 11px 18px;
}
.btn-primary{ background: #1a56c4; border-color: #1a56c4; }
.btn-primary:hover{ background: #12419a; border-color: #12419a; }
.btn-success{ background: #14874f; border-color: #14874f; }
.btn-success:hover{ background: #0f6d3f; border-color: #0f6d3f; }
.btn-lg{ font-size: 16px; }

.alert{ border-radius: 12px; border: none; box-shadow: 0 1px 6px rgba(13,31,60,.08); }

@media (max-width: 576px){
  .form-control, .form-select{ font-size: 16px; } /* iOS zoom fix */
}

/* ============================================================
   v3 polish (2026 Modern UI) — appended overrides
   ============================================================ */
body{
  background:
    radial-gradient(800px 380px at 85% -10%, rgba(37,99,235,.08), transparent 60%),
    #eef1f7;
}
.card{
  border-radius: 18px;
  border: 1px solid #e4e9f2;
  box-shadow: 0 10px 30px rgba(13,31,60,.08);
}
.form-control, .form-select{
  border-radius: 11px;
  padding: 11px 13px;
  background: #fbfcfe;
}
.form-control:focus, .form-select:focus{
  border-color: #2563eb;
  box-shadow: 0 0 0 .22rem rgba(37,99,235,.13);
}
.btn{
  border-radius: 12px;
  font-weight: 700;
  transition: transform .16s ease, box-shadow .16s ease;
}
.btn:hover{ transform: translateY(-1px); }
.btn-primary{
  background: linear-gradient(180deg, #3b76f6, #2563eb);
  border-color: #2563eb;
  box-shadow: 0 6px 16px rgba(37,99,235,.3);
}
.btn-success{ box-shadow: 0 6px 16px rgba(22,163,74,.28); }
@media (max-width: 576px){
  .form-control, .form-select{ font-size: 16px; }
}