/*
 * Domain-Specific CSS
 * Domain ID: 1
 * Hostname: default
 * Generated: 2026-06-06T14:28:17.580115
 */

:root {
    --header-bg-rgb: 60, 179, 113;
    --header-text-rgb: 255, 255, 255;
    --primary-rgb: 60, 179, 113;
    --button-bg-rgb: 60, 179, 113;
    --secondary-button-rgb: 75, 85, 99;
    --delete-button-rgb: 199, 21, 133;
    --quiz-button-rgb: 72, 61, 139;
    --success-button-rgb: 60, 179, 113;
    --warning-button-rgb: 184, 134, 11;
    --info-button-rgb: 25, 25, 112;
}

.domain-header {
    background-color: rgb(var(--header-bg-rgb));
}

.domain-header-text {
    color: rgb(var(--header-text-rgb));
}

.domain-primary {
    color: rgb(var(--primary-rgb));
}

.domain-button {
    background-color: rgb(var(--button-bg-rgb));
    color: white;
    white-space: nowrap;
}

.domain-button:hover {
    opacity: 0.9;
}

.domain-secondary {
    background-color: rgb(var(--secondary-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-secondary:hover {
    opacity: 0.85;
}

.domain-delete {
    background-color: rgb(var(--delete-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-delete:hover {
    opacity: 0.85;
}

.domain-quiz {
    background-color: rgb(var(--quiz-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-quiz:hover {
    opacity: 0.85;
}

.domain-success {
    background-color: rgb(var(--success-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-success:hover {
    opacity: 0.85;
}

.domain-warning {
    background-color: rgb(var(--warning-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-warning:hover {
    opacity: 0.85;
}

.domain-info {
    background-color: rgb(var(--info-button-rgb));
    color: white;
    white-space: nowrap;
}

.domain-info:hover {
    opacity: 0.85;
}

/* ===== 派生クラス（ブランド/意味色をドメイン色から生成） ===== */

/* 層1: ブランドアクセント */
.domain-link { color: rgb(var(--primary-rgb)); }
.domain-link:hover { opacity: 0.7; }
.domain-accent-text { color: rgb(var(--primary-rgb)); }
.domain-progress-fill { background-color: rgb(var(--button-bg-rgb)); }
.domain-avatar { background-color: rgb(var(--button-bg-rgb)); color: #fff; }
.domain-avatar-soft { background-color: rgba(var(--button-bg-rgb), 0.15); color: rgb(var(--button-bg-rgb)); }

/* 入力フォーカス枠（全フォーム共通） */
input:not([type="checkbox"]):not([type="radio"]):focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: none;
    border-color: rgb(var(--primary-rgb));
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.35);
}

/* 層2: 意味付きステータス色（既定は緑/黄/赤/青、テーマで追従） */
.domain-badge-success { background-color: rgba(var(--success-button-rgb), 0.15); color: rgb(var(--success-button-rgb)); }
.domain-badge-warning { background-color: rgba(var(--warning-button-rgb), 0.15); color: rgb(var(--warning-button-rgb)); }
.domain-badge-danger  { background-color: rgba(var(--delete-button-rgb), 0.15);  color: rgb(var(--delete-button-rgb)); }
.domain-badge-info    { background-color: rgba(var(--info-button-rgb), 0.15);    color: rgb(var(--info-button-rgb)); }
.domain-badge-neutral { background-color: #F3F4F6; color: #1F2937; }

.domain-text-success { color: rgb(var(--success-button-rgb)); }
.domain-text-danger  { color: rgb(var(--delete-button-rgb)); }

.domain-progress-success { background-color: rgb(var(--success-button-rgb)); }
.domain-progress-danger  { background-color: rgb(var(--delete-button-rgb)); }

.domain-alert-success { background-color: rgba(var(--success-button-rgb), 0.12); border-left: 4px solid rgb(var(--success-button-rgb)); }
.domain-alert-danger  { background-color: rgba(var(--delete-button-rgb), 0.12);  border-left: 4px solid rgb(var(--delete-button-rgb)); }
.domain-alert-warning { background-color: rgba(var(--warning-button-rgb), 0.12); border-left: 4px solid rgb(var(--warning-button-rgb)); }
.domain-alert-info    { background-color: rgba(var(--info-button-rgb), 0.12);    border-left: 4px solid rgb(var(--info-button-rgb)); }