/* NRDSS - Nuwakot Rasuwa Dhading Samaj Saudi Arabia */
/* Official 3-District Brand Engine & High-Contrast Typography System */

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

:root {
  --primary-blue: #0D47A1;
  --nepali-red: #D32F2F;
  --gold-accent: #F9A825;
  --success-green: #2E7D32;
  --bg-light: #F5F7FA;
  --bg-white: #FFFFFF;
  --text-dark: #111827;
  --text-muted: #4B5563;
  --border-light: #E5E7EB;
}

/* Background: Light Gray #F5F7FA */
body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background-color: #F5F7FA !important;
  background-image: none !important;
  color: #111827 !important;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .brand-font {
  font-family: 'Outfit', sans-serif;
  color: #111827;
}

/* QR Camera Viewfinder Styling */
#gate-scanner-camera-container video,
#qr-reader video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 1.25rem !important;
}

#gate-scanner-camera-container canvas,
#qr-reader canvas {
  display: none !important;
}

#gate-scanner-camera-container img,
#qr-reader img {
  display: none !important;
}

/* Base Card Surface Styles */
.glass-card {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  color: #111827;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.bg-white,
.bg-slate-50,
.bg-slate-100 {
  background-color: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
}

/* Explicit Utility Text Color Enforcement (Never force text-white to black!) */
.text-white,
h1.text-white,
h2.text-white,
h3.text-white,
h4.text-white,
h5.text-white,
h6.text-white,
p.text-white,
span.text-white,
div.text-white {
  color: #FFFFFF !important;
}

.text-slate-100 { color: #F1F5F9 !important; }
.text-slate-200 { color: #E2E8F0 !important; }
.text-slate-300 { color: #CBD5E1 !important; }
.text-amber-300 { color: #FCD34D !important; }
.text-amber-400 { color: #FBBF24 !important; }
.text-amber-500 { color: #F59E0B !important; }
.text-emerald-400 { color: #34D399 !important; }
.text-emerald-300 { color: #6EE7B7 !important; }
.text-red-400 { color: #F87171 !important; }

/* Dedicated Dark Banner Card Surface */
.dark-banner-card {
  background: linear-gradient(to right, #0f172a, #064e3b, #0f172a) !important;
  border: 1px solid rgba(16, 185, 129, 0.5) !important;
  color: #FFFFFF !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

.dark-banner-card h1,
.dark-banner-card h2,
.dark-banner-card h3,
.dark-banner-card h4,
.dark-banner-card .banner-title {
  color: #FFFFFF !important;
}

.dark-banner-card p,
.dark-banner-card .banner-subtext {
  color: #E2E8F0 !important;
}

.dark-banner-card .banner-badge {
  color: #34D399 !important;
}

.glass-card .text-slate-400,
.glass-card .text-slate-500,
.membership-golden-box .text-slate-400,
.membership-golden-box .text-slate-500,
.bg-white .text-slate-400,
.bg-white .text-slate-500 {
  color: #475569 !important;
}

/* Primary Header Navigation Bar - Deep Blue #0D47A1 */
header,
.glass-nav,
nav.glass-nav {
  background: #0D47A1 !important;
  color: #FFFFFF !important;
  border-bottom: 3px solid #F9A825 !important;
  box-shadow: 0 4px 20px rgba(13, 71, 161, 0.3) !important;
}

header *,
.glass-nav *,
nav.glass-nav * {
  color: #FFFFFF !important;
}

header .text-amber-300,
header .text-amber-400,
.glass-nav .text-amber-300,
.glass-nav .text-amber-400 {
  color: #F9A825 !important;
}

header button:hover,
.glass-nav button:hover {
  color: #F9A825 !important;
}

/* Primary Action Buttons - Nepali Red #D32F2F */
button,
button[type="submit"],
.btn-primary,
.bg-emerald-600,
.bg-amber-500,
.bg-red-600 {
  background: linear-gradient(135deg, #D32F2F 0%, #B71C1C 100%) !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  border: 1px solid #B71C1C !important;
  box-shadow: 0 4px 12px rgba(211, 47, 47, 0.3) !important;
  border-radius: 0.75rem !important;
  transition: all 0.2s ease-in-out !important;
}

button *,
button[type="submit"] *,
.btn-primary *,
.bg-emerald-600 *,
.bg-amber-500 *,
.bg-red-600 * {
  color: #FFFFFF !important;
}

button:hover,
button[type="submit"]:hover,
.btn-primary:hover,
.bg-emerald-600:hover,
.bg-amber-500:hover,
.bg-red-600:hover {
  background: linear-gradient(135deg, #E53935 0%, #D32F2F 100%) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(211, 47, 47, 0.45) !important;
}

/* Force Dark Container Text to Stay Pure Bright White */
header .text-white,
header .text-slate-100,
header .text-slate-200,
header .text-slate-300,
header .text-slate-400,
footer .text-white,
footer .text-slate-100,
footer .text-slate-200,
footer .text-slate-300,
footer .text-slate-400,
button .text-white,
button .text-slate-100,
button .text-slate-200,
button .text-slate-300,
.bg-blue-900 .text-white,
.bg-blue-900 .text-slate-100,
.bg-blue-900 .text-slate-200,
.bg-blue-900 .text-slate-300,
.bg-blue-950 .text-white,
.bg-blue-950 .text-slate-100,
.bg-blue-950 .text-slate-200,
.bg-blue-950 .text-slate-300,
.bg-slate-900 .text-white,
.bg-slate-900 .text-slate-100,
.bg-slate-900 .text-slate-200,
.bg-slate-900 .text-slate-300,
.bg-slate-950 .text-white,
.bg-slate-950 .text-slate-100,
.bg-slate-950 .text-slate-200,
.bg-slate-950 .text-slate-300 {
  color: #FFFFFF !important;
}

/* Secondary & Deep Blue Buttons */
.bg-blue-900,
.bg-blue-950,
.btn-secondary {
  background: #0D47A1 !important;
  color: #FFFFFF !important;
  border: 1px solid #0D47A1 !important;
}

.bg-blue-900 *,
.bg-blue-950 *,
.btn-secondary * {
  color: #FFFFFF !important;
}

.bg-blue-900:hover,
.bg-blue-950:hover,
.btn-secondary:hover {
  background: #1565C0 !important;
  color: #FFFFFF !important;
}

/* Success Badges & Statuses - Green #2E7D32 */
.status-approved {
  color: #2E7D32 !important;
}

.bg-emerald-500\/20,
.bg-emerald-500\/10,
.bg-emerald-950\/10 {
  background-color: #E8F5E9 !important;
  border: 1px solid #A5D6A7 !important;
  color: #1B5E20 !important;
}

.bg-emerald-500\/20 *,
.bg-emerald-500\/10 *,
.bg-emerald-950\/10 * {
  color: #1B5E20 !important;
}

/* Highlights & Badges - Gold #F9A825 */
.golden-badge,
.badge-gold {
  background: linear-gradient(135deg, #F9A825 0%, #F57F17 100%) !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.2) !important;
  box-shadow: 0 3px 10px rgba(249, 168, 37, 0.35) !important;
}

.golden-badge *,
.badge-gold * {
  color: #FFFFFF !important;
}

/* Animated Golden Shiny Border for Founder Memberships */
.founder-golden-border,
.membership-golden-box {
  border: 2px solid #F9A825 !important;
  background: #FFFFFF !important;
  box-shadow: 0 0 25px rgba(249, 168, 37, 0.3), inset 0 0 20px rgba(255, 248, 225, 0.5) !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 1.25rem !important;
  animation: goldenGlowPulse 5s infinite alternate ease-in-out !important;
}

/* Animated Golden Sweep Shine Effect */
.founder-golden-border::before,
.membership-golden-box::before {
  content: '';
  position: absolute;
  top: -120%;
  left: -120%;
  width: 340%;
  height: 340%;
  background: linear-gradient(
    45deg,
    transparent 42%,
    rgba(255, 248, 225, 0.6) 47%,
    rgba(249, 168, 37, 0.6) 50%,
    rgba(255, 255, 255, 0.95) 53%,
    transparent 58%
  );
  transform: rotate(35deg);
  animation: goldenShineSweep 7.5s infinite ease-in-out;
  pointer-events: none;
  z-index: 5;
}

@keyframes goldenShineSweep {
  0% { transform: translateX(-150%) rotate(35deg); }
  25% { transform: translateX(150%) rotate(35deg); }
  100% { transform: translateX(150%) rotate(35deg); }
}

@keyframes goldenGlowPulse {
  0% {
    border-color: #F9A825 !important;
    box-shadow: 0 0 20px rgba(249, 168, 37, 0.3), inset 0 0 15px rgba(255, 248, 225, 0.4) !important;
  }
  100% {
    border-color: #F57F17 !important;
    box-shadow: 0 0 40px rgba(249, 168, 37, 0.55), inset 0 0 25px rgba(255, 224, 130, 0.6) !important;
  }
}

/* Close / Cross ('X') Buttons & Action Buttons Fix */
button.absolute, 
.modal-close-btn {
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  border: 1.5px solid #D1D5DB !important;
  border-radius: 9999px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease-in-out !important;
}

button.absolute *,
.modal-close-btn * {
  color: #1F2937 !important;
  stroke: #1F2937 !important;
}

button.absolute:hover, 
.modal-close-btn:hover {
  background-color: #D32F2F !important;
  color: #FFFFFF !important;
  border-color: #B71C1C !important;
  transform: scale(1.08) !important;
}

button.absolute:hover *, 
.modal-close-btn:hover * {
  color: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

button[title="Logout"] {
  background: #FFFFFF !important;
  color: #0D47A1 !important;
  border: 1px solid #D1D5DB !important;
  box-shadow: none !important;
}

button[title="Logout"] * {
  color: #0D47A1 !important;
}

button[title="Logout"]:hover {
  background: #D32F2F !important;
  color: #FFFFFF !important;
}

button[title="Logout"]:hover * {
  color: #FFFFFF !important;
}

/* Copy Member Code Button - High Contrast Gold Style */
button[title="Copy Member Code"] {
  background: #F9A825 !important;
  color: #0D47A1 !important;
  font-weight: 900 !important;
  border: 1.5px solid #F57F17 !important;
  box-shadow: 0 2px 10px rgba(249, 168, 37, 0.45) !important;
  border-radius: 0.5rem !important;
}

button[title="Copy Member Code"] * {
  color: #0D47A1 !important;
}

button[title="Copy Member Code"]:hover {
  background: #FFC107 !important;
  color: #000000 !important;
  transform: scale(1.06) !important;
}

button[title="Copy Member Code"]:hover * {
  color: #000000 !important;
}

/* Form Inputs, Dropdowns & Modals High-Contrast Text System */
input,
select,
textarea,
option,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="url"],
input[type="number"],
input[type="tel"],
input[type="search"] {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border: 1.5px solid #D1D5DB !important;
  border-radius: 0.75rem !important;
  font-weight: 600 !important;
}

select option {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

input::placeholder,
textarea::placeholder,
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #4B5563 !important;
  -webkit-text-fill-color: #4B5563 !important;
  font-weight: 500 !important;
}

.modal-content,
#register-modal > div,
#login-modal > div,
#event-modal > div,
#ad-modal > div,
#broadcast-modal > div,
#qr-scanner-modal > div,
#cropper-modal > div,
#income-modal > div,
#evt-ticket-pass-modal > div {
  background-color: #FFFFFF !important;
  color: #111827 !important;
  border: 1px solid #E5E7EB !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25) !important;
}

.modal-content h1,
.modal-content h2,
.modal-content h3,
.modal-content h4,
.modal-content label,
.modal-content p,
#register-modal h3,
#register-modal label,
#login-modal h3,
#login-modal label,
#event-modal h3,
#event-modal label,
#ad-modal h3,
#ad-modal label,
#broadcast-modal h3,
#broadcast-modal label,
#qr-scanner-modal h3,
#qr-scanner-modal label,
#income-modal h3,
#income-modal h4,
#income-modal th,
#income-modal td {
  color: #111827 !important;
}

/* Table Text & Badges Visibility */
table {
  color: #1F2937 !important;
}

th {
  color: #374151 !important;
  background-color: #F3F4F6 !important;
}

td {
  color: #111827 !important;
}

td .text-slate-400,
td .text-slate-500 {
  color: #4B5563 !important;
}

/* Professional Member ID Card Header - Deep Blue #0D47A1 */
.id-card-header {
  background: linear-gradient(90deg, #0D47A1 0%, #1565C0 50%, #D32F2F 100%) !important;
}

.id-card-header * {
  color: #FFFFFF !important;
}

/* Avatar Clean Crop Styling */
.clean-avatar {
  object-fit: cover;
  mix-blend-mode: normal;
  border-radius: 9999px;
  background-color: #F5F7FA;
  filter: contrast(1.02) brightness(1.02);
}

/* Perfect Round Logo Styling */
.perfect-round-logo {
  aspect-ratio: 1 / 1;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center !important;
  user-select: none;
}

/* Footer Section - Deep Blue #0D47A1 */
footer {
  background: #0D47A1 !important;
  color: #FFFFFF !important;
  border-top: 4px solid #F9A825 !important;
}

footer * {
  color: #FFFFFF !important;
}

footer .text-amber-300 {
  color: #F9A825 !important;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #F5F7FA;
}
::-webkit-scrollbar-thumb {
  background: #BDBDBD;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #0D47A1;
}

/* Modal Animations */
.animate-fadeIn {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.97); }
  to { opacity: 1; transform: scale(1); }
}

/* Printable PDF/PNG Canvas Helper */
#digital-id-card-render {
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

/* Interactive Image Cropper Viewport & Drag Mask */
.cropper-viewport {
  width: 280px;
  height: 280px;
  position: relative;
  overflow: hidden;
  border-radius: 9999px;
  border: 4px solid #D32F2F;
  box-shadow: 0 0 30px rgba(211, 47, 47, 0.3), inset 0 0 20px rgba(0, 0, 0, 0.2);
  background-color: #FFFFFF;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.cropper-viewport:active {
  cursor: grabbing;
}

.cropper-viewport img {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: center center;
  pointer-events: none;
  max-width: none;
}

/* Interactive Stat Card Glow on Hover */
.interactive-stat-card {
  cursor: pointer;
  transition: all 0.25s ease;
}

.interactive-stat-card:hover {
  transform: translateY(-2px);
  border-color: #0D47A1 !important;
  box-shadow: 0 10px 25px -5px rgba(13, 71, 161, 0.25);
}

/* =========================================================
   ULTIMATE HIGH-CONTRAST BLACK TEXT FOR ALL WHITE BOXES & INPUTS
   ========================================================= */
input,
select,
textarea,
option,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="url"],
input[type="number"],
input[type="tel"],
input[type="search"],
.bg-white input,
.bg-white select,
.bg-white textarea,
.bg-white option,
.bg-slate-900 input,
.bg-slate-900 select,
.bg-slate-900 textarea,
.bg-slate-900 option,
.bg-slate-950 input,
.bg-slate-950 select,
.bg-slate-950 textarea,
.bg-slate-950 option,
.glass-card input,
.glass-card select,
.glass-card textarea,
.glass-card option,
#ad-modal input,
#ad-modal select,
#ad-modal textarea,
#ad-modal option,
#event-modal input,
#event-modal select,
#event-modal textarea,
#event-modal option,
#register-modal input,
#register-modal select,
#register-modal textarea,
#login-modal input,
#login-modal select,
#login-modal textarea,
#broadcast-modal input,
#broadcast-modal textarea,
#income-modal input,
#income-modal select,
#qr-scanner-modal input {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background-color: #FFFFFF !important;
  font-weight: 600 !important;
}

/* Dark contrast placeholder text inside white input boxes */
input::placeholder,
textarea::placeholder,
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
.bg-slate-900 input::placeholder,
.bg-slate-900 textarea::placeholder,
.bg-slate-950 input::placeholder,
.bg-slate-950 textarea::placeholder,
#ad-modal input::placeholder,
#ad-modal textarea::placeholder {
  color: #4B5563 !important;
  -webkit-text-fill-color: #4B5563 !important;
  font-weight: 500 !important;
}

/* Non-Pausable Looping Video Advertisement (No Timeline Bar & No Controls Overlay) */
video {
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

video::-webkit-media-controls,
video::-webkit-media-controls-panel,
video::-webkit-media-controls-play-button,
video::-webkit-media-controls-start-playback-button,
video::-webkit-media-controls-timeline,
video::-webkit-media-controls-current-time-display,
video::-webkit-media-controls-time-remaining-display,
video::-webkit-media-controls-mute-button,
video::-webkit-media-controls-toggle-closed-captions-button,
video::-webkit-media-controls-volume-slider {
  display: none !important;
  -webkit-appearance: none !important;
  opacity: 0 !important;
}

/* Interactive Photo Cropper Container Styles */
.cropper-viewport {
  width: 260px;
  height: 260px;
  border-radius: 9999px;
  border: 4px solid #F59E0B;
  box-shadow: 0 0 30px rgba(245, 158, 11, 0.4), inset 0 0 20px rgba(0, 0, 0, 0.6);
  position: relative;
  overflow: hidden;
  background-color: #020617;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cropper-viewport:active {
  cursor: grabbing;
}

#cropper-img-target {
  max-width: none !important;
  max-height: none !important;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: auto;
  transform-origin: center center;
  transition: transform 0.05s ease-out;
}


