/**
 * Kusuma Properti Manager - Japandi Theme Stylesheet
 * File: frontend/css/custom.css
 * Version: v56.0.0 (Preserved Exact Asset Path: ../img/bg-kalibata.webp)
 */

:root {
  --japandi-canvas: #FAF7F2;
  --japandi-wood: #8C5835;
  --japandi-wood-hover: #704326;
  --japandi-moss: #3A5A40;
  --japandi-moss-hover: #2D4732;
  --japandi-clay: #B35436;
  --japandi-border: #E8DFD3;
  --japandi-text: #2C2C2A;
  --japandi-muted: #737370;
  
  /* Dynamic Visual Tokens */
  --japandi-scrim-opacity: 0.65;
  --japandi-bg-brightness: 100%;
  --japandi-bg-contrast: 100%;
}

/* Base Body Styling */
body.bg-japandi-canvas {
  background-color: var(--japandi-canvas) !important;
  color: var(--japandi-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  position: relative;
  min-height: 100vh;
}

/* 1. LAYER FOTO ASLI LATAR BELAKANG (frontend/img/bg-kalibata.webp) */
body.bg-japandi-canvas::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url('../img/bg-kalibata.webp');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  filter: brightness(var(--japandi-bg-brightness)) contrast(var(--japandi-bg-contrast));
  z-index: -2;
  pointer-events: none;
}

/* 2. LAYER SCRIM TRANSPARANSI JAPANDI (Dimanipulasi Slider Opacity) */
body.bg-japandi-canvas::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(250, 247, 242, var(--japandi-scrim-opacity));
  z-index: -1;
  pointer-events: none;
  transition: background-color 0.15s ease;
}

/* Card & Panel Styles */
.japandi-card {
  background-color: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  border: 1px solid var(--japandi-border);
  box-shadow: 0 4px 20px -2px rgba(44, 44, 42, 0.04);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.japandi-panel {
  background-color: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px);
}

.hero-scrim-box {
  background-color: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--japandi-border);
}

/* Button Variants */
.japandi-btn-wood {
  background-color: var(--japandi-wood);
  color: #FFFFFF;
  transition: background-color 0.2s ease, transform 0.1s ease;
}
.japandi-btn-wood:hover {
  background-color: var(--japandi-wood-hover);
}
.japandi-btn-wood:active {
  transform: scale(0.98);
}

.japandi-btn-moss {
  background-color: var(--japandi-moss);
  color: #FFFFFF;
  transition: background-color 0.2s ease, transform 0.1s ease;
}
.japandi-btn-moss:hover {
  background-color: var(--japandi-moss-hover);
}
.japandi-btn-moss:active {
  transform: scale(0.98);
}

/* Typography */
.font-display {
  font-family: Georgia, Cambria, "Times New Roman", Times, serif;
}