body { font-family: 'Inter', sans-serif; background-color: #f8fafc; }
.custom-scroll::-webkit-scrollbar { width: 6px; height: 6px; }
.custom-scroll::-webkit-scrollbar-track { background: transparent; }
.custom-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

.panel-input-box input, .panel-input-box select, .panel-input-box textarea {
    width: 100%; padding: 10px 12px; margin-top: 6px;
    background: #f8fafc; border: 1px solid #cbd5e1;
    color: #0f172a; border-radius: 8px; font-size: 13px; font-weight: 500; outline: none; transition: all 0.2s;
}
.panel-input-box input:focus, .panel-input-box select:focus, .panel-input-box textarea:focus {
    border-color: #2563eb; background-color: white; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}
.panel-input-box label { display: block; margin-top: 14px; font-weight: 700; font-size: 11px; color: #64748b; text-transform: uppercase; }

/* ========================================================
   🔥 KANVAS PRAKICU (KUNCI MUTLAK ANTI-GESER)
   ======================================================== */

.slide-cuaca { 
    position: relative; 
    width: 800px !important; 
    height: 800px !important; 
    min-width: 800px !important; 
    min-height: 800px !important; 
    max-width: 800px !important; /* Mencegah Tailwind mengecilkan kotak */
    max-height: 800px !important;
    margin: 0 auto 30px auto; 
    overflow: hidden; 
    background-color: white; 
    border-radius: 12px; 
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.05); 
    border: 1px solid #e2e8f0; 
}

.bg-template { 
    position: absolute !important; 
    top: 0 !important;
    left: 0 !important;
    width: 800px !important; 
    height: 800px !important; 
    max-width: 800px !important; /* Membunuh aturan Tailwind img max-width 100% */
    max-height: 800px !important;
    display: block; 
    object-fit: fill !important; /* Paksa gambar nge-pas ke 800x800, jangan cover! */
    z-index: 1 !important;
}

.teks-absolut { 
    position: absolute; 
    z-index: 10 !important; /* Pastikan selalu di atas background */
}

#iconPagi, #iconSiang, #iconMalam, #iconDiniHari { 
    width: 85px !important; 
    height: auto !important; 
    max-width: none !important; /* Cegah ikon gepeng/menyusut */
}