/* ==========================================
   TPQ AL-MAIDAH KARANGSONO - Stylesheet
   Extracted from inline <style> block
   ========================================== */

/* Global form element sizing */
input,
select,
button {
  width: 100% !important;
  padding: 12px;
  margin: 10px 0;
}

/* Brand color tokens */
:root {
  --bca-primary: #003399;
  --bca-secondary: #0056b3;
  --bca-light: #e6f0ff;
}

body {
  font-family: 'Inter', sans-serif;
  background: linear-gradient(135deg, #f0f4f8 0%, #d9e2ec 100%);
  min-height: 100vh;
}

/* Glassmorphism card */
.glass-card {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 10px 25px rgba(0, 51, 153, 0.1);
}

.bca-gradient {
  background: linear-gradient(135deg, #003399 0%, #0055cc 100%);
}

.input-focus:focus {
  border-color: var(--bca-primary);
  box-shadow: 0 0 0 4px rgba(0, 51, 153, 0.1);
}

.btn-bounce:active {
  transform: scale(0.97);
}

/* Loaders */
.loader-pro {
  width: 20px;
  height: 20px;
  border: 2px solid #fff;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  animation: rotation 1s linear infinite;
}

.loader-blue {
  border: 2px solid #003399;
  border-bottom-color: transparent;
}

.loader-purple {
  border: 2px solid #9333ea;
  border-bottom-color: transparent;
}

@keyframes rotation {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Entrance animations */
.fade-up {
  animation: fadeUp 0.6s ease-out forwards;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.modal-enter {
  animation: modalEnter 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes modalEnter {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

/* Layout helpers */
.header-tabs button {
  margin: 0 !important;
}

.mini-input {
  padding: 8px 12px !important;
  margin: 0 !important;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* ===== Bottom Navigation ===== */
#bottom-nav button {
  width: auto !important;
  padding: 10px 0 !important;
  margin: 0 !important;
  flex: 1;
}

/* ===== Admin Panel ===== */
#admin-tabs button {
  width: auto !important;
  padding: 10px 8px !important;
  margin: 0 !important;
  flex: 1;
}

.btn-add {
  width: auto !important;
  padding: 10px 14px !important;
  margin: 0 !important;
}

.btn-delete {
  width: auto !important;
  padding: 6px !important;
  margin: 0 !important;
}

.active-tab {
  background: #e6f0ff !important;
  color: #003399 !important;
}

/* Safe area for iPhone X+ notch */
#bottom-nav {
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

/* Panitia jabatan select in admin list */
.jabatan-select {
  width: auto !important;
  padding: 6px 8px !important;
  margin: 0 !important;
  flex: 1;
  min-width: 0;
}
