/* โหมดมืดของ personnel.php — สร้างอัตโนมัติจากสีในหน้า อย่าแก้ไฟล์นี้ด้วยมือ ให้รันสคริปต์สร้างใหม่ */
html[data-theme="dark"] body{background:#0f0c14;color:#d5cfdb}
html[data-theme="dark"] .page-hero{background:linear-gradient(135deg,#25121d,#28131f);border-bottom:1px solid rgba(236,72,153,.15)}
html[data-theme="dark"] .breadcrumb{color:#aba0b7}
html[data-theme="dark"] .breadcrumb a:hover{color:#ec4899}
html[data-theme="dark"] .hero-badge{background:#1a161d;border:1px solid rgba(236,72,153,.25);color:#ef80ae}
html[data-theme="dark"] .page-title{color:#ddd9e2}
html[data-theme="dark"] .page-title em{color:#ec4899}
html[data-theme="dark"] .group-label{background:#28131f;color:#ef80ae}
html[data-theme="dark"] .group-h2{color:#ddd9e2}
html[data-theme="dark"] .group-h2 em{color:#ec4899}
html[data-theme="dark"] .group-divider{background:linear-gradient(90deg,#ec4899,#be185d)}
html[data-theme="dark"] .person-card:hover .person-name-bar{background:linear-gradient(135deg,#be185d,#9d174d)}
html[data-theme="dark"] .person-photo{border-radius:16px;background:linear-gradient(160deg,#28131f,#141829)}
html[data-theme="dark"] .person-name-bar{background:#0f172a;border-radius:0 0 10px 10px}
html[data-theme="dark"] .sub-title{color:#ef80ae;border-bottom:2px solid #442537}
html[data-theme="dark"] .sub-title::before{background:#ec4899}
html[data-theme="dark"] .section-sep{background:rgba(236,72,153,.15)}
html[data-theme="dark"] .empty-state{color:#aba0b7}
html[data-theme="dark"] footer{background:#0f172a}
html[data-theme="dark"] footer a:hover{color:#f472b6}
html[data-theme="dark"] .per-modal{background:#1a161d}
html[data-theme="dark"] .per-modal-left{background:linear-gradient(160deg,#be185d 0%,#9d174d 40%,#6d1130 100%)}
html[data-theme="dark"] .per-modal-close{color:#aba0b7}
html[data-theme="dark"] .per-modal-close:hover{background:#28131f;color:#ec4899}
html[data-theme="dark"] .pm-section-title{color:#ef80ae;border-bottom:1.5px solid #442537}
html[data-theme="dark"] .pm-list li{color:#d5cfdb}
html[data-theme="dark"] .pm-list li::before{color:#ec4899}
html[data-theme="dark"] .pm-detail{color:#d5cfdb}
html[data-theme="dark"] .pm-contact-item{color:#d5cfdb}
html[data-theme="dark"] .pm-contact-item .icon{background:#28131f}
html[data-theme="dark"] .pm-social a{background:#28131f}
html[data-theme="dark"] .pm-social a:hover{background:#ec4899}
html[data-theme="dark"] .pm-empty{color:#aba0b7}
html[data-theme="dark"] [style*="color:var(--pink)"]{color:#ec4899!important}
