/* =========================================================
   🌌 1. BASE DARK CORE THEME (CYBERPUNK MATRIX) & UTILITIES
   ========================================================= */
body {
    background-color: #020617; /* Deep Slate 950 */
    color: #f8fafc;
    overflow: hidden;
    transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), color 0.4s ease, background-image 0.4s ease;
}

/* Custom smooth scrollbar behavior for massive data streams */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #0f172a; /* Slate 900 */
}
::-webkit-scrollbar-thumb {
    background: #334155; /* Slate 700 */
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #2dd4bf; /* Glowing Teal */
}
.transition-all {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =========================================================
   🌸 2. V CLINIC PASTEL BEACH THEME OVERRIDE (YELLOW & GREEN WATERCOLOR)
   ========================================================= */
body.theme-pastel {
    background-color: #FAF8F2 !important; /* Creamy Beach Sand */
    color: #1e3a2f !important; /* Deep forest charcoal for clear readability */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300' viewBox='0 0 300 300'%3E%3Ccircle cx='70' cy='80' r='85' fill='%23a7f3d0' fill-opacity='0.25' filter='blur(35px)'/%3E%3Ccircle cx='230' cy='210' r='90' fill='%23fef08a' fill-opacity='0.25' filter='blur(40px)'/%3E%3C/svg%3E") !important;
    background-repeat: repeat !important;
}

/* 🎯 [SEMANTIC PASTEL OUTSIDE FRAME]: ย้อมโครงขอบนอกสุดและแถบล導導หลักให้เป็นกระจกฝ้าครีมหาดทรายขาว */
body.theme-pastel #main-navigation-sidebar,
body.theme-pastel main > header,
body.theme-pastel main {
    background-color: rgba(255, 255, 255, 0.65) !important;
    backdrop-filter: blur(25px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(25px) saturate(1.4) !important;
    border-color: #D1E5DA !important;
    color: #155e75 !important;
}

/* 🎯 [SEMANTIC PASTEL INNER PANELS]: เจาะจงเฉพาะกล่องภายในแชตและตาราง ไม่ทำลายกล่องย่อยอื่นข้ามหน้าจอ */
body.theme-pastel #gem-sidebar,
body.theme-pastel #odoo-graphic-section,
body.theme-pastel #chat-stream > div,
body.theme-pastel .bg-slate-900 border,
body.theme-pastel th {
    background-color: rgba(235, 251, 246, 0.6) !important;
    border-color: #C2DCD0 !important;
    color: #155e75 !important;
}

body.theme-pastel .text-slate-100, 
body.theme-pastel .text-slate-200, 
body.theme-pastel .text-slate-300,
body.theme-pastel td span.font-semibold,
body.theme-pastel h1, body.theme-pastel h2 { color: #115e59 !important; } 
body.theme-pastel .text-slate-400, body.theme-pastel .text-slate-500 { color: #166534 !important; } 
body.theme-pastel select { color: #115e59 !important; background-color: #FFFFFF !important; border-color: #A7F3D0 !important; }
body.theme-pastel input { color: #115e59 !important; background-color: transparent !important; border-color: #A7F3D0 !important; }
body.theme-pastel tbody tr:hover { background-color: rgba(167, 243, 208, 0.15) !important; }
body.theme-pastel th { background-color: rgba(228, 247, 239, 0.95) !important; }

/* เปลี่ยนสีปุ่มลากยาวให้เข้าโทนคลื่นทะเลมัลดีฟส์สปีดร้อยเปอร์เซ็นต์ */
body.theme-pastel [class*="from-rose"], 
body.theme-pastel [class*="from-pink"], 
body.theme-pastel .btn-action-matrix,
body.theme-pastel button[class*="bg-blue-600"] {
    background-image: linear-gradient(to right, #2dd4bf, #06b6d4) !important;
    background-color: #06b6d4 !important;
    color: #ffffff !important;
}

/* =========================================================
   🌱 3. ZEN BONSAI EARTH CORE THEME OVERRIDE (HIGH-END WELLNESS)
   ========================================================= */
body.theme-dark-floral {
    background-color: #E2E7D5 !important; /* Warm Sage/Olive Wellness */
    color: #1A2E22 !important; 
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cpath d='M40 10c2 10-5 15-10 15s-8-5-5-15 13-2 15 0zm0 0c-2 10 5 15 10 15s8-5 5-15-13-2-15 0z' fill='%2322c55e' fill-opacity='0.08'/%3E%3C/svg%3E") !important;
    background-repeat: repeat !important;
}

/* 🎯 [SEMANTIC ZEN OUTSIDE FRAME]: ย้อมโครงขอบนอกและหัวบาร์ให้เป็นกระจกฝ้าน้ำนมชาเขียวมัทฉะ */
body.theme-dark-floral #main-navigation-sidebar,
body.theme-dark-floral main > header,
body.theme-dark-floral main {
    background-color: rgba(255, 255, 255, 0.65) !important;
    backdrop-filter: blur(25px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(25px) saturate(1.3) !important;
    border-color: #C4D0BB !important;
    color: #1A2E22 !important;
}

/* 🎯 [SEMANTIC ZEN INNER PANELS]: ล็อกความเสถียรของกล่องย่อยประวัติแชตและกราฟวิเคราะห์ Odoo */
body.theme-dark-floral #gem-sidebar,
body.theme-dark-floral #odoo-graphic-section,
body.theme-dark-floral #chat-stream > div,
body.theme-dark-floral th {
    background-color: rgba(235, 241, 226, 0.6) !important;
    border-color: #B6C4AC !important;
    color: #1A2E22 !important;
}

body.theme-dark-floral .text-slate-100, 
body.theme-dark-floral .text-slate-200, 
body.theme-dark-floral .text-slate-300,
body.theme-dark-floral td span.font-semibold,
body.theme-dark-floral h1, body.theme-dark-floral h2 { color: #1A2E22 !important; }
body.theme-dark-floral .text-slate-400, body.theme-dark-floral .text-slate-500 { color: #4B5E51 !important; } 
body.theme-dark-floral select { color: #1A2E22 !important; background-color: #FFFFFF !important; border-color: #C4D0BB !important; }
body.theme-dark-floral input { color: #1A2E22 !important; background-color: transparent !important; border-color: #C4D0BB !important; }
body.theme-dark-floral tbody tr:hover { background-color: rgba(187, 247, 208, 0.22) !important; }
body.theme-dark-floral th { background-color: rgba(223, 230, 214, 0.95) !important; }

/* ย้อมสีปุ่มหลักฝั่งโหมดเซนให้เป็นสีหยกป่าขจีพรีเมียม */
body.theme-dark-floral [class*="from-rose"], 
body.theme-dark-floral [class*="from-pink"], 
body.theme-dark-floral .btn-action-matrix,
body.theme-dark-floral button[class*="bg-blue-600"] {
    background-image: linear-gradient(to right, #10b981, #059669) !important;
    background-color: #059669 !important;
    color: #ffffff !important;
}

/* =========================================================
   🌿 4. THE JADE BONSAI / SEEDLING GLOBAL ICON GLOW
   ========================================================= */
#theme-btn-icon.fa-seedling {
    font-size: 14px !important;
    color: #059669 !important; 
    filter: drop-shadow(0 0 6px #34d399) drop-shadow(0 0 12px rgba(5, 150, 105, 0.4)) !important;
    transform: scale(1.22);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), filter 0.3s ease;
}

body.theme-dark-floral button[onclick*="toggleQuantumTheme"] {
    background-color: rgba(16, 185, 129, 0.15) !important;
    border-color: #10b981 !important;
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.25) !important;
}

/* =========================================================
   🛠 5. HISTORY ACTION RECOVERY SHIELD (PENCIL, TRASH & EXPAND FIX)
   ========================================================= */
/* คืนชีพกล่องซ่อนตัวตนของปุ่มดินสอและปุ่มถังขยะให้กางปีกออกมาเมื่อเอาเมาส์ชี้แถว */
#chat-history-list li:hover > div:last-child {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* 🎯 [THE FIX] Ensure the child icons inside the container are clickable and hoverable */
#chat-history-list li div > button {
    cursor: pointer !important;
    position: relative !important;
    z-index: 10 !important;
}

.fa-pen:hover, .fa-pencil:hover { color: #2dd4bf !important; transform: scale(1.15); }
.fa-trash:hover, .fa-trash-can:hover { color: #f43f5e !important; transform: scale(1.15); }

/* Theme Overrides for Icons */
body.theme-pastel .fa-pen, body.theme-pastel .fa-pencil { color: #0f766e !important; }
body.theme-pastel .fa-trash, body.theme-pastel .fa-trash-can { color: #be123c !important; }
body.theme-dark-floral .fa-pen, body.theme-dark-floral .fa-pencil { color: #166534 !important; }
body.theme-dark-floral .fa-trash, body.theme-dark-floral .fa-trash-can { color: #9a3412 !important; }

/* =========================================================
   🪄 6. DYNAMIC JAVASCRIPT COLOR OVERRIDES (FOR LIGHT THEMES)
   ========================================================= */

/* 🌸 Pastel Theme Contrasts: Forces neon text to deep teal and backgrounds to soft mint */
body.theme-pastel [class*="text-blue-400"], 
body.theme-pastel [class*="text-emerald-400"], 
body.theme-pastel [class*="text-purple-400"], 
body.theme-pastel [class*="text-teal-400"] {
    color: #0f766e !important; /* Deep Teal for readability */
}
body.theme-pastel [class*="bg-blue-950"], 
body.theme-pastel [class*="bg-emerald-950"], 
body.theme-pastel [class*="bg-purple-950"] {
    background-color: rgba(45, 212, 191, 0.15) !important;
    border-color: #99f6e4 !important;
}

/* 🌿 Zen Floral Contrasts: Forces neon text to deep forest green and backgrounds to soft matcha */
body.theme-dark-floral [class*="text-blue-400"], 
body.theme-dark-floral [class*="text-emerald-400"], 
body.theme-dark-floral [class*="text-purple-400"], 
body.theme-dark-floral [class*="text-teal-400"] {
    color: #166534 !important; /* Deep Forest Green */
}
body.theme-dark-floral [class*="bg-blue-950"], 
body.theme-dark-floral [class*="bg-emerald-950"], 
body.theme-dark-floral [class*="bg-purple-950"] {
    background-color: rgba(22, 163, 74, 0.15) !important;
    border-color: #bbf7d0 !important;
}

/* Custom utility extensions harmonized with your framework themes */
#live-ledger-card {
    transition: background-color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}

/* Connect cleanly into the light theme semantic panels you wrote */
body.theme-pastel #live-ledger-card,
body.theme-pastel .salary-field-group {
    background-color: rgba(235, 251, 246, 0.7) !important;
    border-color: #C2DCD0 !important;
}

body.theme-dark-floral #live-ledger-card,
body.theme-dark-floral .salary-field-group {
    background-color: rgba(235, 241, 226, 0.7) !important;
    border-color: #B6C4AC !important;
}

/* UI Structure rules for input forms */
.salary-field-group {
    background: rgba(15, 23, 42, 0.4);
    border: 1px solid #1e293b;
    border-radius: 0.75rem;
    padding: 1rem;
    transition: all 0.2s ease-in-out;
}
.salary-field-group:focus-within {
    border-color: #2dd4bf !important;
    box-shadow: 0 0 12px rgba(45, 212, 191, 0.15);
}

/* Native styling for collapsible memo containers */
.salary-memo-dropdown summary {
    outline: none;
    user-select: none;
}
.salary-memo-dropdown[open] summary {
    border-bottom: 1px dashed rgba(51, 65, 85, 0.4);
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}