/**
 * DM9 Phase 3 — สี accent การ์ด hub (TAS / term setup ฯลฯ)
 * ค่า --dm-hub-accent-N อยู่ใน ui-token-derived.css; palette override ได้ใน layouts.php
 */

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(1),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(1) {
    --dm-hub-accent: var(--dm-hub-accent-1);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(2),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(2) {
    --dm-hub-accent: var(--dm-hub-accent-2);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(3),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(3) {
    --dm-hub-accent: var(--dm-hub-accent-3);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(4),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(4) {
    --dm-hub-accent: var(--dm-hub-accent-4);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(5),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(5) {
    --dm-hub-accent: var(--dm-hub-accent-5);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(6),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(6) {
    --dm-hub-accent: var(--dm-hub-accent-6);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(7),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(7) {
    --dm-hub-accent: var(--dm-hub-accent-7);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(8),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(8) {
    --dm-hub-accent: var(--dm-hub-accent-8);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(9),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(9) {
    --dm-hub-accent: var(--dm-hub-accent-9);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(10),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(10) {
    --dm-hub-accent: var(--dm-hub-accent-10);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"]:nth-child(11),
.dm-standard-page [class*="-hub-grid"] > [class*="col-"]:nth-child(11) {
    --dm-hub-accent: var(--dm-hub-accent-11);
    --tas-accent: var(--dm-hub-accent);
    --tsu-accent: var(--dm-hub-accent);
}

.dm-standard-page .dm-hub-grid > [class*="col-"] [class*="-tile-icon"],
.dm-standard-page [class*="-hub-grid"] > [class*="col-"] [class*="-tile-icon"] {
    background: color-mix(in srgb, var(--dm-hub-accent, var(--dm-primary, #34495e)) 12%, transparent) !important;
    color: var(--dm-hub-accent, var(--dm-primary, #34495e)) !important;
}

.dm-standard-page .dm-hub-grid > [class*="col-"] .dm-hub-tile .card-header .card-title,
.dm-standard-page [class*="-hub-grid"] > [class*="col-"] .dm-hub-tile .card-header .card-title {
    color: var(--dm-hub-accent, var(--dm-primary, #34495e)) !important;
}