/* リセット＆基本設定 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    /* カラーパレット（プロフェッショナル財務スタイル） */
    --primary-color: #1a3a5c;
    --secondary-color: #2c5f8d;
    --accent-color: #e67e22;
    --success-color: #27ae60;
    --warning-color: #f39c12;
    --danger-color: #e74c3c;
    --info-color: #3498db;

    /* ニュートラルカラー（ライトモード） */
    --bg-color: #f5f7fa;
    --card-bg: #ffffff;
    --border-color: #dfe6e9;
    --text-primary: #2c3e50;
    --text-secondary: #7f8c8d;
    --text-light: #95a5a6;
    --input-bg: #ffffff;
    --table-header-bg: var(--primary-color);
    --table-row-hover: #f0f4f8;
    --modal-overlay: rgba(0, 0, 0, 0.6);

    /* シャドウ */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 20px rgba(0,0,0,0.12);

    /* トランジション */
    --transition: all 0.3s ease;
}

/* ダークモード */
[data-theme="dark"] {
    --primary-color: #4a90c2;
    --secondary-color: #6ba8d9;
    --bg-color: #1a1a2e;
    --card-bg: #16213e;
    --border-color: #2d3a5a;
    --text-primary: #e8e8e8;
    --text-secondary: #a0a0a0;
    --text-light: #707070;
    --input-bg: #1f2b47;
    --table-header-bg: #2d3a5a;
    --table-row-hover: #1f2b47;
    --modal-overlay: rgba(0, 0, 0, 0.8);
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.3);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.4);
    --shadow-lg: 0 10px 20px rgba(0,0,0,0.5);
}

[data-theme="dark"] .login-screen {
    background: linear-gradient(135deg, #0f0f23, #1a1a2e);
}

[data-theme="dark"] .login-container {
    background: var(--card-bg);
}

[data-theme="dark"] .login-header i {
    color: var(--accent-color);
}

[data-theme="dark"] .login-header h1,
[data-theme="dark"] .header-left h1,
[data-theme="dark"] .section-header h2,
[data-theme="dark"] .section-header h3,
[data-theme="dark"] .settings-section h3 {
    color: var(--text-primary);
}

[data-theme="dark"] .login-form input,
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select {
    background: var(--input-bg);
    color: var(--text-primary);
    border-color: var(--border-color);
}

[data-theme="dark"] .login-form input::placeholder,
[data-theme="dark"] .form-group input::placeholder {
    color: var(--text-secondary);
}

[data-theme="dark"] input[readonly] {
    background: #2d3a5a !important;
    color: var(--text-primary);
}

[data-theme="dark"] .data-table thead {
    background: var(--table-header-bg);
}

[data-theme="dark"] .data-table tbody tr:hover {
    background: var(--table-row-hover);
}

[data-theme="dark"] .modal {
    background: var(--modal-overlay);
}

[data-theme="dark"] .modal-header {
    background: var(--table-header-bg);
}

[data-theme="dark"] .month-selector {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .current-month {
    color: var(--text-primary);
}

[data-theme="dark"] .month-selector .btn-icon {
    color: var(--text-primary);
}

[data-theme="dark"] .month-selector .btn-icon:hover {
    background: var(--primary-color);
    color: #fff;
}

[data-theme="dark"] .tab-btn {
    color: var(--text-secondary);
}

[data-theme="dark"] .tab-btn:hover,
[data-theme="dark"] .tab-btn.active {
    color: var(--primary-color);
    background: var(--card-bg);
}

[data-theme="dark"] .app-header {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .header-left i {
    color: var(--accent-color);
}

[data-theme="dark"] .tab-navigation {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .btn-secondary {
    background: var(--text-secondary);
}

[data-theme="dark"] .store-card-header {
    background: var(--table-header-bg);
}

[data-theme="dark"] .metric-value {
    color: var(--primary-color);
}

[data-theme="dark"] .alert-item {
    background: var(--card-bg);
}

[data-theme="dark"] .threshold-info {
    background: var(--card-bg);
    color: var(--text-primary);
}

[data-theme="dark"] .shift-calendar {
    background: var(--card-bg);
}

[data-theme="dark"] .shift-calendar-table th,
[data-theme="dark"] .shift-calendar-table td {
    border-color: var(--border-color);
}

[data-theme="dark"] .date-column {
    background: var(--table-header-bg);
    color: var(--text-primary);
}

[data-theme="dark"] .shift-cell {
    background: var(--card-bg);
}

[data-theme="dark"] .shift-cell.empty-cell {
    background: var(--bg-color);
}

[data-theme="dark"] .shift-count {
    color: var(--text-primary);
}

[data-theme="dark"] .week-summary {
    background: var(--card-bg);
    color: var(--text-primary);
}

[data-theme="dark"] .week-summary span {
    color: var(--text-secondary);
}

body {
    font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: var(--bg-color);
    color: var(--text-primary);
    line-height: 1.6;
    min-height: 100vh;
}

/* ログイン画面 */
.login-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    position: relative;
}

.login-container {
    background: #ffffff;
    padding: 3rem;
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 420px;
    position: relative;
    overflow: hidden;
}

.login-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('../images/cuore-logo.png');
    background-size: 80%;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0.08;
    z-index: 0;
    pointer-events: none;
}

.login-header {
    text-align: center;
    margin-bottom: 2rem;
    position: relative;
    z-index: 1;
}

.login-header i {
    font-size: 3rem;
    color: var(--accent-color);
    margin-bottom: 1rem;
}

.login-header h1 {
    font-size: 1.75rem;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.login-header p {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.login-form {
    position: relative;
    z-index: 1;
}

.login-form .form-group {
    margin-bottom: 1.5rem;
}

.login-form label {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--text-primary);
    font-weight: 500;
}

.login-form input {
    width: 100%;
    padding: 0.875rem;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    font-size: 1rem;
    transition: var(--transition);
}

.login-form input:focus {
    outline: none;
    border-color: var(--primary-color);
}

.error-message {
    color: var(--danger-color);
    font-size: 0.875rem;
    margin-top: 0.5rem;
    display: none;
}

.error-message.show {
    display: block;
}

/* ボタン */
.btn-primary, .btn-secondary, .btn-icon {
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary {
    background: var(--primary-color);
    color: white;
    width: 100%;
    justify-content: center;
}

.btn-primary:hover {
    background: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background: var(--text-light);
    color: white;
}

.btn-secondary:hover {
    background: var(--text-secondary);
}

.btn-icon {
    padding: 0.5rem;
    background: transparent;
    color: var(--primary-color);
}

.btn-icon:hover {
    background: var(--bg-color);
}

.btn-edit {
    background-color: #2563eb;
    color: #fff;
    padding: 6px 12px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-right: 6px;
    transition: background-color 0.2s;
}

.btn-edit:hover {
    background-color: #1d4ed8;
}

.btn-delete {
    background-color: #dc2626;
    color: #fff;
    padding: 6px 12px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background-color 0.2s;
}

.btn-delete:hover {
    background-color: #b91c1c;
}

.action-buttons {
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.btn-secondary-sm {
    background-color: #6b7280;
    color: #fff;
    padding: 6px 12px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background-color 0.2s;
}

.btn-secondary-sm:hover {
    background-color: #4b5563;
}

/* メインアプリケーション */
.main-app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.hidden {
    display: none !important;
}

/* ヘッダー */
.app-header {
    background: var(--card-bg);
    border-bottom: 2px solid var(--border-color);
    padding: 1rem 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: var(--shadow-sm);
    position: sticky;
    top: 0;
    z-index: 100;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-left i {
    font-size: 1.75rem;
    color: var(--accent-color);
}

.header-left h1 {
    font-size: 1.5rem;
    color: var(--primary-color);
    font-weight: 700;
}

.header-center {
    flex: 1;
    display: flex;
    justify-content: center;
}

.month-selector {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--bg-color);
    padding: 0.5rem 1.5rem;
    border-radius: 8px;
    border: 2px solid var(--primary-color);
}

.month-selector .btn-icon {
    font-size: 1.25rem;
    padding: 0.5rem 0.75rem;
    color: var(--primary-color);
    background: transparent;
    border-radius: 6px;
}

.month-selector .btn-icon:hover {
    background: var(--primary-color);
    color: #fff;
}

.current-month {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--primary-color);
    min-width: 120px;
    text-align: center;
    user-select: none;
}

/* タブナビゲーション */
.tab-navigation {
    background: var(--card-bg);
    border-bottom: 2px solid var(--border-color);
    padding: 0 2rem;
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
}

.tab-btn {
    padding: 1rem 1.5rem;
    border: none;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: var(--transition);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tab-btn:hover {
    color: var(--primary-color);
    background: var(--bg-color);
}

.tab-btn.active {
    color: var(--primary-color);
    border-bottom-color: var(--accent-color);
    background: var(--bg-color);
}

/* メインコンテンツ */
.main-content {
    flex: 1;
    padding: 2rem;
    max-width: 1600px;
    margin: 0 auto;
    width: 100%;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 店舗カード（4列グリッド） */
.store-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin-bottom: 3rem;
}

.store-card {
    background: var(--card-bg);
    border-radius: 12px;
    box-shadow: var(--shadow-md);
    overflow: hidden;
    transition: var(--transition);
}

.store-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.store-card-header {
    background: var(--primary-color);
    color: white;
    padding: 1rem;
    text-align: center;
}

.store-card-header h3 {
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.store-card-body {
    padding: 1.5rem;
}

.metric-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.metric-row:last-child {
    margin-bottom: 0;
}

.metric-label {
    color: var(--text-secondary);
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
    text-align: right;
}

.metric-value-secondary {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--info-color);
    text-align: right;
}

.metric-text {
    font-size: 1rem;
    font-weight: 500;
    color: var(--text-primary);
    text-align: right;
}

.total-card .store-card-header {
    background: var(--accent-color);
}

/* セクション見出し */
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--border-color);
}

.section-header h2, .section-header h3 {
    color: var(--primary-color);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-header h2 {
    font-size: 1.5rem;
}

.section-header h3 {
    font-size: 1.25rem;
}

/* 異常パネル */
.alert-panel {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: var(--shadow-md);
}

.alert-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.alert-item {
    padding: 1rem;
    border-radius: 8px;
    border-left: 4px solid;
    background: var(--bg-color);
}

.alert-item.warning {
    border-color: var(--warning-color);
}

.alert-item.danger {
    border-color: var(--danger-color);
}

.no-alerts {
    color: var(--text-secondary);
    text-align: center;
    padding: 2rem;
}

/* スタッフ一覧 */
.staff-list-section {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: var(--shadow-md);
}

/* テーブル */
.table-container {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card-bg);
}

.data-table thead {
    background: var(--primary-color);
    color: white;
}

.data-table th {
    padding: 1rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--primary-color);
}

.data-table td {
    padding: 1rem;
    border-bottom: 1px solid var(--border-color);
}

.data-table tbody tr:hover {
    background: var(--bg-color);
}

.data-table .no-data {
    text-align: center;
    color: var(--text-secondary);
    padding: 2rem;
}

.status-badge {
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 500;
}

.status-blue {
    background: rgba(52, 152, 219, 0.2);
    color: #3498db;
    padding: 2px 8px;
    border-radius: 4px;
}

.status-white {
    background: rgba(149, 165, 166, 0.2);
    color: #bdc3c7;
    padding: 2px 8px;
    border-radius: 4px;
}

.status-yellow {
    background: rgba(243, 156, 18, 0.2);
    color: #f39c12;
    padding: 2px 8px;
    border-radius: 4px;
}

.status-red {
    background: rgba(231, 76, 60, 0.2);
    color: #e74c3c;
    padding: 2px 8px;
    border-radius: 4px;
}

/* グラフエリア */
.charts-section {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 1rem;
}

.chart-container {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 2rem;
    box-shadow: var(--shadow-md);
}

/* 入力フォーム */
.form-container {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 2rem;
    box-shadow: var(--shadow-md);
    margin-bottom: 2rem;
}

.input-form {
    margin-bottom: 2rem;
}

.form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-group {
    display: flex;
    flex-direction: column;
}

.form-group label {
    margin-bottom: 0.5rem;
    color: var(--text-primary);
    font-weight: 500;
    font-size: 0.9rem;
}

.required {
    color: var(--danger-color);
}

.form-group input, .form-group select {
    padding: 0.75rem;
    border: 2px solid var(--border-color);
    border-radius: 8px;
    font-size: 1rem;
    transition: var(--transition);
}

.form-group input:focus, .form-group select:focus {
    outline: none;
    border-color: var(--primary-color);
}

.conditional-fields {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px dashed var(--border-color);
}

.form-actions {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
}

.form-actions .btn-primary {
    width: auto;
}

/* データリスト */
.data-list-section {
    margin-top: 3rem;
}

/* 設定セクション */
.settings-section {
    margin-bottom: 3rem;
}

.settings-section h3 {
    color: var(--primary-color);
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 600;
}

/* レスポンシブ */
@media (max-width: 1200px) {
    .store-cards {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .charts-section {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .app-header {
        flex-direction: column;
        gap: 0.5rem;
        padding: 0.75rem 1rem;
    }

    .header-center {
        width: 100%;
    }
    
    .store-cards {
        grid-template-columns: 1fr;
    }
    
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .tab-navigation {
        padding: 0 1rem;
    }
    
    .main-content {
        padding: 1rem;
    }
}

/* ユーティリティクラス */
.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.text-success {
    color: var(--success-color);
}

.text-warning {
    color: var(--warning-color);
}

.text-danger {
    color: var(--danger-color);
}

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }

/* モーダルダイアログ */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    animation: fadeIn 0.2s ease;
}

.modal-content {
    background: var(--card-bg);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    width: 90%;
    max-width: 600px;
    max-height: 90vh;
    overflow-y: auto;
    animation: slideUp 0.3s ease;
}

@keyframes slideUp {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header {
    background: var(--primary-color);
    color: white;
    padding: 1.5rem;
    border-radius: 12px 12px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h2 {
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.btn-close {
    background: transparent;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    transition: var(--transition);
}

.btn-close:hover {
    color: var(--accent-color);
    transform: rotate(90deg);
}

.modal-form {
    padding: 2rem;
}

.modal-form .form-actions {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 2px solid var(--border-color);
}

/* 追加スタイル - 仕様書準拠 */

/* 目標達成率表示（小さめ） */
.metric-row.metric-small {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.metric-row.metric-small .metric-label,
.metric-row.metric-small .metric-text {
    font-size: 0.75rem;
    opacity: 0.8;
}

/* ステータスカラー（仕様書準拠：生産性） */
.status-blue { color: #3498db !important; }
.status-white { color: #ffffff !important; }
.status-yellow { color: #f39c12 !important; }
.status-red { color: #e74c3c !important; }
.status-normal { color: #27ae60 !important; }

.status-badge.status-blue { background: #3498db; color: white; }
.status-badge.status-white { background: #ecf0f1; color: #2c3e50; }
.status-badge.status-yellow { background: #f39c12; color: white; }
.status-badge.status-red { background: #e74c3c; color: white; }

.status-text.status-yellow { background: rgba(243, 156, 18, 0.2); padding: 2px 6px; border-radius: 4px; }
.status-text.status-red { background: rgba(231, 76, 60, 0.2); padding: 2px 6px; border-radius: 4px; }

/* アラートタブ */
.alert-tabs {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.alert-tab-btn {
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 4px;
    background: rgba(255,255,255,0.1);
    color: white;
    cursor: pointer;
    transition: all 0.2s;
}

.alert-tab-btn:hover {
    background: rgba(255,255,255,0.2);
}

.alert-tab-btn.active {
    background: #e67e22;
}

.alert-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    background: rgba(255,255,255,0.05);
}

.alert-item.alert-red {
    background: rgba(231, 76, 60, 0.2);
    border-left: 4px solid #e74c3c;
}

.alert-item.alert-yellow {
    background: rgba(243, 156, 18, 0.2);
    border-left: 4px solid #f39c12;
}

.alert-item.alert-flag {
    background: rgba(52, 152, 219, 0.2);
    border-left: 4px solid #3498db;
}

/* 判定バッジ */
.judgment-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    background: rgba(255,255,255,0.1);
    margin-right: 0.5rem;
}

.judgment-badge.judgment-OK { background: #27ae60; }
.judgment-badge.judgment-要注意 { background: #f39c12; }
.judgment-badge.judgment-要面談 { background: #e74c3c; }

/* メモセル */
.memo-cell {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 給与計算サマリー */
.salary-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.summary-card {
    background: rgba(255,255,255,0.05);
    padding: 1rem;
    border-radius: 8px;
    text-align: center;
}

.summary-card .label {
    display: block;
    font-size: 0.85rem;
    opacity: 0.7;
    margin-bottom: 0.5rem;
}

.summary-card .value {
    display: block;
    font-size: 1.5rem;
    font-weight: bold;
}

.summary-card.highlight {
    background: linear-gradient(135deg, #e67e22, #d35400);
}

.summary-card.highlight .value,
.summary-card.highlight .summary-value {
    color: white !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.summary-card.highlight .summary-label {
    color: rgba(255,255,255,0.9);
}

/* 顧客分析セクション */
.analysis-section {
    margin-bottom: 2rem;
}

.analysis-section h3 {
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.store-ranking-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.ranking-card {
    background: rgba(255,255,255,0.05);
    padding: 1rem;
    border-radius: 8px;
}

.ranking-card h4 {
    margin-bottom: 0.75rem;
    text-align: center;
    color: #e67e22;
}

.ranking-list {
    font-size: 0.85rem;
}

.ranking-item {
    padding: 0.5rem;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.ranking-item:last-child {
    border-bottom: none;
}

/* 閾値情報 */
.threshold-info {
    background: rgba(255,255,255,0.05);
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.85rem;
}

.threshold-info p {
    margin-bottom: 0.5rem;
}

/* テーブルハイライト */
td.highlight {
    background: rgba(230, 126, 34, 0.2) !important;
    font-weight: bold;
}

/* モーダルサイズ */
.modal-small .modal-content {
    max-width: 400px;
}

.modal-large .modal-content {
    max-width: 900px;
}

/* ボタン小 */
.btn-small {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
}

/* レスポンシブ調整 */
@media (max-width: 768px) {
    .salary-summary {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .store-ranking-cards {
        grid-template-columns: 1fr;
    }
    
    .alert-tabs {
        flex-wrap: wrap;
    }
}

/* ========================================
   シフト週間カレンダー スタイル
   ======================================== */
.shift-calendar {
    background: rgba(255,255,255,0.98);
    border-radius: 12px;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    overflow-x: auto;
}

.shift-calendar-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 800px;
}

.shift-calendar-table th,
.shift-calendar-table td {
    border: 1px solid #e0e0e0;
    text-align: center;
    vertical-align: top;
}

.shift-calendar-table th {
    padding: 0.75rem 0.5rem;
    font-weight: 600;
    font-size: 0.9rem;
}

.store-column {
    width: 80px;
    background: #34495e;
    color: white;
}

.date-column {
    background: #f8f9fa;
    min-width: 100px;
}

.date-column.weekend-header {
    background: #fff3e0;
    color: #e65100;
}

.store-name-cell {
    padding: 1rem 0.5rem;
    font-weight: 700;
    font-size: 0.95rem;
    color: white;
}

.store-name-cell.cuore { background: linear-gradient(135deg, #e74c3c, #c0392b); }
.store-name-cell.arise { background: linear-gradient(135deg, #3498db, #2980b9); }
.store-name-cell.ageha { background: linear-gradient(135deg, #9b59b6, #8e44ad); }

.shift-cell {
    padding: 0.5rem;
    min-height: 80px;
    transition: all 0.2s;
}

.shift-cell.empty-cell {
    background: #fafafa;
    color: #ccc;
    font-size: 1.5rem;
}

.shift-cell.has-shift {
    background: #e8f5e9;
}

.shift-cell.weekend-cell {
    background: #fff8e1;
}

.shift-cell.has-shift.weekend-cell {
    background: #fff3e0;
}

.shift-cell.warning-cell {
    background: #ffebee !important;
    border: 2px solid #e74c3c !important;
}

.shift-count {
    font-size: 1.2rem;
    font-weight: 700;
    color: #2c3e50;
    margin-bottom: 0.25rem;
}

.shift-hours {
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 0.25rem;
}

.shift-names {
    font-size: 0.7rem;
    color: #888;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 auto;
}

.labor-rate {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    margin-top: 0.25rem;
    display: inline-block;
}

.labor-rate.rate-ok {
    background: #d4edda;
    color: #155724;
}

.labor-rate.rate-warning {
    background: #f8d7da;
    color: #721c24;
    animation: pulse 1s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.week-summary {
    display: flex;
    gap: 2rem;
    justify-content: center;
    padding: 1rem;
    background: var(--card-bg);
    border-radius: 8px;
    margin-top: 1rem;
    font-size: 0.9rem;
    color: var(--text-primary);
}

.week-summary span {
    color: var(--text-primary);
}

/* 店舗行ホバー効果 */
.store-row:hover .shift-cell {
    filter: brightness(0.97);
}

/* レスポンシブ */
@media (max-width: 900px) {
    .shift-calendar {
        padding: 0.5rem;
    }
    .shift-calendar-table th,
    .shift-calendar-table td {
        padding: 0.4rem;
        font-size: 0.8rem;
    }
    .shift-count {
        font-size: 1rem;
    }
    .week-summary {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }
}

/* シフトカレンダー編集機能 */
.shift-cell:hover {
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.edit-hint {
    font-size: 0.7rem;
    color: #888;
    margin-top: 0.25rem;
    opacity: 0;
    transition: opacity 0.2s;
}

.shift-cell:hover .edit-hint {
    opacity: 1;
}

.add-hint {
    font-size: 2rem;
    color: #ccc;
    transition: all 0.2s;
}

.shift-cell.empty-cell:hover {
    background: #e3f2fd !important;
}

.shift-cell.empty-cell:hover .add-hint {
    color: #2196F3;
    transform: scale(1.2);
}

/* モーダル内ボタン */
.btn-danger {
    background: #e74c3c;
    color: white;
    border: none;
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
}

.btn-danger:hover {
    background: #c0392b;
}

.btn-small {
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
}

/* テーマ切替ボタン */
.theme-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-color);
    border: 2px solid var(--border-color);
    border-radius: 24px;
    padding: 6px 12px;
    cursor: pointer;
    transition: var(--transition);
    margin-right: 12px;
}

.theme-toggle:hover {
    border-color: var(--primary-color);
}

.theme-toggle i {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.theme-toggle .fa-sun {
    color: #f39c12;
}

.theme-toggle .fa-moon {
    color: #6c5ce7;
}

[data-theme="dark"] .theme-toggle {
    background: var(--card-bg);
}

[data-theme="dark"] .theme-toggle .fa-moon {
    transform: rotate(-20deg);
}

.theme-toggle-label {
    font-size: 0.85rem;
    color: var(--text-secondary);
    font-weight: 500;
}

/* ダークモード: シフトカレンダー週合計 */
[data-theme="dark"] .week-summary {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #ccc !important;
}

[data-theme="dark"] .week-summary span {
    color: #333333 !important;
    font-weight: 600;
}

/* ダークモード: シフトカレンダー全体 */
[data-theme="dark"] .shift-calendar {
    background: #1a1a2e;
}

[data-theme="dark"] .shift-calendar-table th,
[data-theme="dark"] .shift-calendar-table td {
    border-color: #3d4a6a;
}

[data-theme="dark"] .date-column {
    background: #2d3a5a;
    color: #ffffff;
}

[data-theme="dark"] .date-column.weekend-header {
    background: #4a3a2a;
    color: #ffb74d;
}

[data-theme="dark"] .shift-cell {
    background: #16213e;
    color: #e0e0e0;
}

[data-theme="dark"] .shift-cell.empty-cell {
    background: #1a1a2e;
}

[data-theme="dark"] .shift-cell.empty-cell .add-hint {
    color: #5a6a8a;
}

[data-theme="dark"] .shift-cell.empty-cell:hover {
    background: #2d3a5a !important;
}

[data-theme="dark"] .shift-cell.empty-cell:hover .add-hint {
    color: #6ba8d9;
}

[data-theme="dark"] .shift-cell.has-shift {
    background: #1e3a2a;
}

[data-theme="dark"] .shift-cell.weekend-cell {
    background: #2a2a1e;
}

[data-theme="dark"] .shift-cell.has-shift.weekend-cell {
    background: #3a3a1e;
}

[data-theme="dark"] .shift-count {
    color: #ffffff;
}

[data-theme="dark"] .shift-hours {
    color: #a0a0a0;
}

[data-theme="dark"] .shift-names {
    color: #8a8a8a;
}

[data-theme="dark"] .store-name-cell {
    color: #ffffff;
}

[data-theme="dark"] .store-name-cell.cuore {
    background: linear-gradient(135deg, #c0392b, #922b21);
}

[data-theme="dark"] .store-name-cell.arise {
    background: linear-gradient(135deg, #2980b9, #1a5276);
}

[data-theme="dark"] .store-name-cell.ageha {
    background: linear-gradient(135deg, #8e44ad, #6c3483);
}

/* ========================================
   求人管理タブ リデザイン
   ======================================== */

/* ヘッダーコントロール */
.recruitment-header-controls {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

/* サマリーカード群（常時表示） */
.recruitment-summary-cards {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: var(--card-bg);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
}

.recruitment-summary-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--bg-color);
    border-radius: 10px;
    border: 1px solid var(--border-color);
    transition: var(--transition);
}

.recruitment-summary-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.recruitment-summary-card .card-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color);
    color: #ffffff;
    border-radius: 10px;
    font-size: 1.25rem;
}

.recruitment-summary-card .card-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.recruitment-summary-card .card-label {
    font-size: 0.8rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.recruitment-summary-card .card-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
}

.recruitment-summary-card.highlight {
    background: linear-gradient(135deg, var(--accent-color), #d35400);
    border: none;
}

.recruitment-summary-card.highlight .card-icon {
    background: rgba(255, 255, 255, 0.2);
}

.recruitment-summary-card.highlight .card-label,
.recruitment-summary-card.highlight .card-value {
    color: #ffffff;
}

/* サブタブナビゲーション */
.recruitment-sub-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid var(--border-color);
}

.recruitment-sub-tab {
    padding: 0.875rem 1.5rem;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: var(--text-secondary);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: -2px;
}

.recruitment-sub-tab:hover {
    color: var(--primary-color);
    background: rgba(74, 144, 194, 0.05);
}

.recruitment-sub-tab.active {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
    background: transparent;
}

.recruitment-sub-tab i {
    font-size: 1rem;
}

/* パネル */
.recruitment-panel {
    display: none;
    animation: fadeIn 0.3s ease;
}

.recruitment-panel.active {
    display: block;
}

.recruitment-panel .panel-header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* レスポンシブ対応 */
@media (max-width: 1200px) {
    .recruitment-summary-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .recruitment-summary-cards {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .recruitment-sub-tabs {
        flex-wrap: wrap;
    }
    
    .recruitment-sub-tab {
        flex: 1;
        justify-content: center;
        padding: 0.75rem 1rem;
    }
}

@media (max-width: 480px) {
    .recruitment-summary-cards {
        grid-template-columns: 1fr;
    }
    
    .recruitment-summary-card {
        padding: 0.875rem 1rem;
    }
    
    .recruitment-summary-card .card-value {
        font-size: 1.25rem;
    }
}

/* ダークモード対応 */
[data-theme="dark"] .recruitment-summary-cards {
    background: #16213e;
}

[data-theme="dark"] .recruitment-summary-card {
    background: #1f2b47;
    border-color: #2d3a5a;
}

[data-theme="dark"] .recruitment-summary-card:hover {
    background: #2d3a5a;
}

[data-theme="dark"] .recruitment-summary-card .card-icon {
    background: #4a90c2;
}

[data-theme="dark"] .recruitment-sub-tabs {
    border-bottom-color: #2d3a5a;
}

[data-theme="dark"] .recruitment-sub-tab:hover {
    background: rgba(107, 168, 217, 0.1);
}

[data-theme="dark"] .recruitment-sub-tab.active {
    color: #6ba8d9;
    border-bottom-color: #6ba8d9;
}

/* ========================================
   媒体費用セクション
   ======================================== */

.media-cost-section {
    background: var(--bg-color);
    border-radius: 10px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid var(--border-color);
}

.section-header-inline {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.section-header-inline h4 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
}

.section-header-inline h4 i {
    color: var(--primary-color);
}

.compact-form .form-row {
    align-items: flex-end;
}

.form-actions-inline {
    display: flex;
    align-items: flex-end;
    padding-bottom: 0.25rem;
}

/* 媒体費用リスト */
.media-cost-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

.media-cost-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.9rem;
}

.media-cost-item .media-name {
    font-weight: 600;
    color: var(--text-primary);
}

.media-cost-item .media-amount {
    color: var(--accent-color);
    font-weight: 700;
}

.media-cost-item .media-memo {
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.media-cost-item .btn-delete-small {
    padding: 0.25rem 0.5rem;
    background: transparent;
    border: none;
    color: var(--danger-color);
    cursor: pointer;
    opacity: 0.6;
    transition: var(--transition);
}

.media-cost-item .btn-delete-small:hover {
    opacity: 1;
}

/* ダークモード対応 */
[data-theme="dark"] .media-cost-section {
    background: #1f2b47;
    border-color: #2d3a5a;
}

[data-theme="dark"] .media-cost-item {
    background: #16213e;
    border-color: #2d3a5a;
}

/* 前月比バッジ */
.mom-badge {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}

/* ===== Dashboard Inline Styles (extracted from index.html) ===== */
/* =====================================================
   ダッシュボード専用スタイル - モダンダークテーマ
   ===================================================== */

/* ダッシュボード全体の背景 */
#dashboardTab {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: linear-gradient(135deg, #0f0c29 0%, #1a1a3e 50%, #24243e 100%);
    border-radius: 24px;
    padding: 2rem;
    min-height: calc(100vh - 200px);
}

/* ダッシュボードグリッド */
.dashboard-grid {
    display: grid;
    grid-template-columns: 3fr 1fr;
    gap: 2rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
    align-items: stretch;
}

.dashboard-left {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.dashboard-right {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.dashboard-right .staff-section-compact {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.dashboard-right .staff-section-compact .staff-table-scroll {
    flex: 1;
    overflow-y: auto;
}

.dashboard-right .reservation-section-compact {
    flex: 0 0 auto;
}

/* =====================================================
   店舗カード - 月次（4列）
   ===================================================== */
.store-cards-compact {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.store-card-compact {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.store-card-compact::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #f39c12, #e67e22);
}

.store-card-compact::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, transparent 50%);
    pointer-events: none;
}

.store-card-compact:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* CUORE - オレンジ */
.store-card-compact[data-store="CUORE"]::before {
    background: linear-gradient(90deg, #ff8c00, #ff6b35);
}
.store-card-compact[data-store="CUORE"] h4 i {
    color: #ff8c00;
    filter: drop-shadow(0 0 8px rgba(255, 140, 0, 0.5));
}
.store-card-compact[data-store="CUORE"] .big-value {
    color: #ff8c00;
    text-shadow: 0 0 20px rgba(255, 140, 0, 0.3);
}

/* ARISE - ブルー */
.store-card-compact[data-store="ARISE"]::before {
    background: linear-gradient(90deg, #00d4ff, #0099cc);
}
.store-card-compact[data-store="ARISE"] h4 i {
    color: #00d4ff;
    filter: drop-shadow(0 0 8px rgba(0, 212, 255, 0.5));
}
.store-card-compact[data-store="ARISE"] .big-value {
    color: #00d4ff;
    text-shadow: 0 0 20px rgba(0, 212, 255, 0.3);
}

/* AGEHA - パープル */
.store-card-compact[data-store="AGEHA"]::before {
    background: linear-gradient(90deg, #a855f7, #7c3aed);
}
.store-card-compact[data-store="AGEHA"] h4 i {
    color: #a855f7;
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.5));
}
.store-card-compact[data-store="AGEHA"] .big-value {
    color: #a855f7;
    text-shadow: 0 0 20px rgba(168, 85, 247, 0.3);
}

.store-card-compact h4 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
    color: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    position: relative;
    z-index: 1;
}

.store-card-compact .big-value {
    font-size: 2.25rem;
    font-weight: 800;
    text-align: center;
    margin: 1rem 0;
    letter-spacing: -1px;
    position: relative;
    z-index: 1;
}

.store-card-compact .metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    font-size: 0.85rem;
    position: relative;
    z-index: 1;
}

.store-card-compact .metric {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.store-card-compact .metric-label {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.store-card-compact .metric-value {
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    font-size: 1rem;
}

.store-card-compact .metric-value.success { color: #10b981; }
.store-card-compact .metric-value.warning { color: #f59e0b; }
.store-card-compact .metric-value.danger { color: #ef4444; }

/* 合算カード - 特別なグラデーション */
.store-card-compact.total {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #6B73FF 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.store-card-compact.total::before {
    background: linear-gradient(90deg, rgba(255,255,255,0.5), rgba(255,255,255,0.2));
}

.store-card-compact.total::after {
    background: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, transparent 60%);
}

.store-card-compact.total:hover {
    box-shadow: 0 20px 60px rgba(102, 126, 234, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.store-card-compact.total h4 { color: white; }
.store-card-compact.total h4 i { color: white; filter: none; }
.store-card-compact.total .big-value { color: white; text-shadow: 0 2px 10px rgba(0,0,0,0.2); }
.store-card-compact.total .metric-label { color: rgba(255,255,255,0.7); }
.store-card-compact.total .metric-value { color: white; }

/* =====================================================
   週次サマリーセクション
   ===================================================== */
.weekly-summary-section {
    margin-top: 1.5rem !important;
}

.weekly-summary-section > div:first-child {
    text-align: center;
    margin-bottom: 1rem !important;
}

.weekly-summary-section > div:first-child span {
    font-size: 0.85rem !important;
    color: rgba(255, 255, 255, 0.6) !important;
    background: rgba(255, 255, 255, 0.1) !important;
    padding: 6px 16px !important;
    border-radius: 20px !important;
    backdrop-filter: blur(10px);
}

/* 週次カードグリッド */
.weekly-summary-section > div:nth-child(2) {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1.5rem !important;
}

/* 週次カード共通スタイル */
.weekly-card {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95)) !important;
    backdrop-filter: blur(20px) !important;
    border-radius: 16px !important;
    padding: 1.5rem !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative;
    overflow: hidden;
}

.weekly-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
}

.weekly-card:hover {
    transform: translateY(-8px) scale(1.02) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* CUORE週次 - オレンジ */
.weekly-card:nth-child(1)::before { background: linear-gradient(90deg, #ff8c00, #ff6b35) !important; }
.weekly-card:nth-child(1) h5 { color: #ff8c00 !important; }
.weekly-card:nth-child(1) > div:nth-child(2) { color: #ff8c00 !important; text-shadow: 0 0 20px rgba(255, 140, 0, 0.3); }

/* ARISE週次 - ブルー */
.weekly-card:nth-child(2)::before { background: linear-gradient(90deg, #00d4ff, #0099cc) !important; }
.weekly-card:nth-child(2) h5 { color: #00d4ff !important; }
.weekly-card:nth-child(2) > div:nth-child(2) { color: #00d4ff !important; text-shadow: 0 0 20px rgba(0, 212, 255, 0.3); }

/* AGEHA週次 - パープル */
.weekly-card:nth-child(3)::before { background: linear-gradient(90deg, #a855f7, #7c3aed) !important; }
.weekly-card:nth-child(3) h5 { color: #a855f7 !important; }
.weekly-card:nth-child(3) > div:nth-child(2) { color: #a855f7 !important; text-shadow: 0 0 20px rgba(168, 85, 247, 0.3); }

/* 合算週次 - 特別グラデーション */
.weekly-card:nth-child(4) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #6B73FF 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}
.weekly-card:nth-child(4)::before { background: linear-gradient(90deg, rgba(255,255,255,0.5), rgba(255,255,255,0.2)) !important; }
.weekly-card:nth-child(4) h5 { color: white !important; }
.weekly-card:nth-child(4) > div:nth-child(2) { color: white !important; }
.weekly-card:nth-child(4):hover {
    box-shadow: 0 20px 60px rgba(102, 126, 234, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}

.weekly-card h5 {
    margin-bottom: 0.75rem !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
}

.weekly-card > div:nth-child(2) {
    font-size: 1.75rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px;
}

.weekly-card > div:nth-child(3) {
    display: flex !important;
    gap: 1.5rem !important;
    margin-top: 0.75rem !important;
    font-size: 0.75rem !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

.weekly-card > div:nth-child(3) strong {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* =====================================================
   グラフボックス
   ===================================================== */
.charts-compact {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 1rem;
}

.chart-box {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.chart-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
}

.chart-box h5 {
    font-size: 0.95rem;
    margin-bottom: 1rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.chart-box h5 i {
    color: #a855f7;
    filter: drop-shadow(0 0 6px rgba(168, 85, 247, 0.4));
}

.chart-box canvas {
    max-height: 180px !important;
}

/* =====================================================
   アラートパネル
   ===================================================== */
.alert-panel-compact {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    max-height: 250px;
    overflow-y: auto;
}

.alert-panel-compact h5 {
    font-size: 1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 600;
}

.alert-panel-compact h5 i {
    color: #f59e0b;
    filter: drop-shadow(0 0 6px rgba(245, 158, 11, 0.4));
}

.alert-counts {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    font-size: 0.85rem;
}

.alert-count {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 12px;
    font-weight: 600;
    backdrop-filter: blur(10px);
}

.alert-count.red {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}
.alert-count.yellow {
    background: rgba(245, 158, 11, 0.2);
    color: #f59e0b;
    border: 1px solid rgba(245, 158, 11, 0.3);
}
.alert-count.flag {
    background: rgba(59, 130, 246, 0.2);
    color: #3b82f6;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.alert-list-compact {
    font-size: 0.85rem;
}

.alert-list-compact .no-alerts {
    color: rgba(255, 255, 255, 0.5) !important;
}

.alert-item-compact {
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-left: 4px solid;
    transition: all 0.3s ease;
    color: rgba(255, 255, 255, 0.9);
}

.alert-item-compact:hover {
    transform: translateX(6px);
}

.alert-item-compact.red {
    border-left-color: #ef4444;
    background: rgba(239, 68, 68, 0.15);
}
.alert-item-compact.yellow {
    border-left-color: #f59e0b;
    background: rgba(245, 158, 11, 0.15);
}
.alert-item-compact.flag {
    border-left-color: #3b82f6;
    background: rgba(59, 130, 246, 0.15);
}

/* =====================================================
   スタッフセクション
   ===================================================== */
.staff-section-compact {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.staff-section-compact h5 {
    font-size: 1rem;
    margin-bottom: 1rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.staff-section-compact h5 i {
    color: #00d4ff;
    filter: drop-shadow(0 0 6px rgba(0, 212, 255, 0.4));
}

.staff-table-compact {
    width: 100%;
    font-size: 0.8rem;
    border-collapse: collapse;
}

.staff-table-compact th,
.staff-table-compact td {
    padding: 0.75rem 0.5rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.staff-table-compact th {
    background: rgba(255, 255, 255, 0.05);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.staff-table-compact td {
    color: rgba(255, 255, 255, 0.9);
}

.staff-table-compact tbody tr {
    transition: all 0.2s ease;
}

.staff-table-compact tbody tr:hover {
    background: rgba(255, 255, 255, 0.05);
}

.staff-table-compact .text-right {
    text-align: right;
}

.staff-table-compact .no-data {
    color: rgba(255, 255, 255, 0.4);
}

.staff-table-scroll {
    max-height: 300px;
    overflow-y: auto;
}

/* =====================================================
   予約セクション
   ===================================================== */
.reservation-section-compact {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95)) !important;
    backdrop-filter: blur(20px) !important;
    border-radius: 16px !important;
    padding: 1.5rem !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
    margin-top: 1rem !important;
}

.reservation-section-compact h5 {
    font-size: 1rem !important;
    margin-bottom: 1rem !important;
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

.reservation-section-compact h5 i {
    color: #10b981 !important;
    filter: drop-shadow(0 0 6px rgba(16, 185, 129, 0.4));
}

.reservation-section-compact h5 span {
    color: rgba(255, 255, 255, 0.5) !important;
}

.reservation-list-compact .no-data {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* =====================================================
   バッジスタイル
   ===================================================== */
.badge-sm {
    padding: 4px 12px;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.3px;
}

.badge-sm.blue {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    color: white;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.4);
}
.badge-sm.white {
    background: linear-gradient(135deg, rgba(255,255,255,0.2), rgba(255,255,255,0.1));
    color: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.badge-sm.yellow {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: white;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.4);
}
.badge-sm.red {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.4);
}

/* =====================================================
   レスポンシブデザイン
   ===================================================== */
@media (max-width: 1200px) {
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
    .store-cards-compact {
        grid-template-columns: repeat(2, 1fr);
    }
    .weekly-summary-section > div:nth-child(2) {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .charts-compact {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    #dashboardTab {
        padding: 1rem;
        border-radius: 16px;
    }
    .store-cards-compact {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .weekly-summary-section > div:nth-child(2) {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    .charts-compact {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .store-card-compact .big-value {
        font-size: 1.75rem;
    }
    .weekly-card > div:nth-child(2) {
        font-size: 1.5rem !important;
    }
    .alert-counts {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
}

/* カスタムスクロールバー */
#dashboardTab ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
#dashboardTab ::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 3px;
}
#dashboardTab ::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
}
#dashboardTab ::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* =====================================================
   全タブ共通 - モダンダークテーマ
   ===================================================== */

/* --- 共通: form-container 背景 --- */
#storeDailyTab .form-container,
#castDailyTab .form-container,
#customerTab .form-container,
#customerAnalysisTab .form-container,
#salaryTab .form-container,
#maleStaffTab .form-container,
#settingsTab .form-container,
#reservationTab .form-container,
#shiftTab .form-container,
#recruitmentTab .form-container {
    background: linear-gradient(135deg, #0f0c29 0%, #1a1a3e 50%, #24243e 100%);
    border-radius: 24px;
    padding: 2rem;
    min-height: calc(100vh - 200px);
}

/* --- 共通: セクションヘッダー --- */
#storeDailyTab .section-header h2,
#castDailyTab .section-header h2,
#customerTab .section-header h2,
#customerAnalysisTab .section-header h2,
#salaryTab .section-header h2,
#maleStaffTab .section-header h2,
#settingsTab .section-header h2,
#reservationTab .section-header h2,
#shiftTab .section-header h2,
#recruitmentTab .section-header h2 {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
}
#storeDailyTab .section-header h2 i,
#castDailyTab .section-header h2 i,
#customerTab .section-header h2 i,
#customerAnalysisTab .section-header h2 i,
#salaryTab .section-header h2 i,
#maleStaffTab .section-header h2 i,
#settingsTab .section-header h2 i,
#reservationTab .section-header h2 i,
#shiftTab .section-header h2 i,
#recruitmentTab .section-header h2 i {
    color: #a855f7;
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.5));
}
#storeDailyTab .section-header h3,
#castDailyTab .section-header h3,
#customerTab .section-header h3,
#customerAnalysisTab .section-header h3,
#salaryTab .section-header h3,
#maleStaffTab .section-header h3,
#settingsTab .section-header h3, 
#settingsTab .settings-section h3,
#reservationTab .section-header h3,
#shiftTab .section-header h3,
#recruitmentTab .section-header h3 {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.1rem;
}
#storeDailyTab .section-header h3 i,
#castDailyTab .section-header h3 i,
#customerTab .section-header h3 i,
#customerAnalysisTab .section-header h3 i,
#salaryTab .section-header h3 i,
#maleStaffTab .section-header h3 i,
#settingsTab .section-header h3 i,
#reservationTab .section-header h3 i,
#shiftTab .section-header h3 i,
#recruitmentTab .section-header h3 i {
    color: #00d4ff;
}

/* --- 共通: 店舗フィルターボタン --- */
#storeDailyTab .store-filter .store-btn,
#castDailyTab .store-filter .store-btn,
#customerTab .store-filter .store-btn,
#customerAnalysisTab .store-filter .store-btn,
#salaryTab .store-filter .store-btn,
#maleStaffTab .store-filter .store-btn,
#reservationTab .store-filter .store-btn,
#shiftTab .store-filter .store-btn,
#recruitmentTab .store-filter .store-btn {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 0.5rem 1.2rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
}
#storeDailyTab .store-filter .store-btn:hover,
#castDailyTab .store-filter .store-btn:hover,
#customerTab .store-filter .store-btn:hover,
#customerAnalysisTab .store-filter .store-btn:hover,
#salaryTab .store-filter .store-btn:hover,
#maleStaffTab .store-filter .store-btn:hover,
#reservationTab .store-filter .store-btn:hover,
#shiftTab .store-filter .store-btn:hover,
#recruitmentTab .store-filter .store-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}
#storeDailyTab .store-filter .store-btn.active,
#castDailyTab .store-filter .store-btn.active,
#customerTab .store-filter .store-btn.active,
#customerAnalysisTab .store-filter .store-btn.active,
#salaryTab .store-filter .store-btn.active,
#maleStaffTab .store-filter .store-btn.active,
#reservationTab .store-filter .store-btn.active,
#shiftTab .store-filter .store-btn.active,
#recruitmentTab .store-filter .store-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}
#storeDailyTab .store-filter .btn-icon,
#castDailyTab .store-filter .btn-icon,
#customerTab .store-filter .btn-icon,
#salaryTab .store-filter .btn-icon,
#maleStaffTab .store-filter .btn-icon,
#reservationTab .store-filter .btn-icon,
#shiftTab .store-filter .btn-icon {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 0.5rem 0.8rem;
    cursor: pointer;
    transition: all 0.3s ease;
}
#storeDailyTab .store-filter .btn-icon:hover,
#castDailyTab .store-filter .btn-icon:hover,
#customerTab .store-filter .btn-icon:hover,
#salaryTab .store-filter .btn-icon:hover,
#maleStaffTab .store-filter .btn-icon:hover,
#reservationTab .store-filter .btn-icon:hover,
#shiftTab .store-filter .btn-icon:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* --- 共通: フォーム入力 --- */
#storeDailyTab .form-group label,
#castDailyTab .form-group label,
#customerTab .form-group label,
#salaryTab .form-group label,
#maleStaffTab .form-group label,
#settingsTab .form-group label,
#reservationTab .form-group label,
#shiftTab .form-group label,
#recruitmentTab .form-group label {
    color: rgba(255, 255, 255, 0.8);
    font-weight: 500;
}
#storeDailyTab .form-group label .required,
#castDailyTab .form-group label .required,
#customerTab .form-group label .required,
#salaryTab .form-group label .required,
#maleStaffTab .form-group label .required,
#reservationTab .form-group label .required,
#shiftTab .form-group label .required,
#recruitmentTab .form-group label .required {
    color: #ef4444;
}
#storeDailyTab .form-group input,
#storeDailyTab .form-group select,
#storeDailyTab .form-group textarea,
#castDailyTab .form-group input,
#castDailyTab .form-group select,
#castDailyTab .form-group textarea,
#customerTab .form-group input,
#customerTab .form-group select,
#customerTab .form-group textarea,
#salaryTab .form-group input,
#salaryTab .form-group select,
#maleStaffTab .form-group input,
#maleStaffTab .form-group select,
#settingsTab .form-group input,
#settingsTab .form-group select,
#reservationTab .form-group input,
#reservationTab .form-group select,
#reservationTab .form-group textarea,
#shiftTab .form-group input,
#shiftTab .form-group select,
#recruitmentTab .form-group input,
#recruitmentTab .form-group select,
#recruitmentTab .form-group textarea {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
    border-radius: 10px;
}
#storeDailyTab .form-group input::placeholder,
#castDailyTab .form-group input::placeholder,
#customerTab .form-group input::placeholder,
#salaryTab .form-group input::placeholder,
#maleStaffTab .form-group input::placeholder,
#settingsTab .form-group input::placeholder,
#reservationTab .form-group input::placeholder,
#shiftTab .form-group input::placeholder,
#recruitmentTab .form-group input::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}
#storeDailyTab .form-group input:focus,
#storeDailyTab .form-group select:focus,
#castDailyTab .form-group input:focus,
#castDailyTab .form-group select:focus,
#customerTab .form-group input:focus,
#customerTab .form-group select:focus,
#salaryTab .form-group input:focus,
#salaryTab .form-group select:focus,
#maleStaffTab .form-group input:focus,
#maleStaffTab .form-group select:focus,
#settingsTab .form-group input:focus,
#settingsTab .form-group select:focus,
#reservationTab .form-group input:focus,
#reservationTab .form-group select:focus,
#shiftTab .form-group input:focus,
#shiftTab .form-group select:focus,
#recruitmentTab .form-group input:focus,
#recruitmentTab .form-group select:focus {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.2) !important;
}

/* --- 共通: ボタン --- */
#storeDailyTab .btn-primary,
#castDailyTab .btn-primary,
#customerTab .btn-primary,
#salaryTab .btn-primary,
#maleStaffTab .btn-primary,
#settingsTab .btn-primary,
#reservationTab .btn-primary,
#shiftTab .btn-primary,
#recruitmentTab .btn-primary {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    border: none;
    color: #fff;
    border-radius: 10px;
    padding: 0.6rem 1.5rem;
    font-weight: 600;
    transition: all 0.3s ease;
}
#storeDailyTab .btn-primary:hover,
#castDailyTab .btn-primary:hover,
#customerTab .btn-primary:hover,
#salaryTab .btn-primary:hover,
#maleStaffTab .btn-primary:hover,
#settingsTab .btn-primary:hover,
#reservationTab .btn-primary:hover,
#shiftTab .btn-primary:hover,
#recruitmentTab .btn-primary:hover {
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.5);
    transform: translateY(-1px);
}
#storeDailyTab .btn-secondary,
#castDailyTab .btn-secondary,
#customerTab .btn-secondary,
#salaryTab .btn-secondary,
#maleStaffTab .btn-secondary,
#settingsTab .btn-secondary,
#reservationTab .btn-secondary,
#shiftTab .btn-secondary,
#recruitmentTab .btn-secondary {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.8) !important;
    border-radius: 10px;
}

/* --- 共通: テーブル --- */
#storeDailyTab .table-container,
#castDailyTab .table-container,
#customerTab .table-container,
#customerAnalysisTab .table-container,
#salaryTab .table-container,
#maleStaffTab .table-container,
#settingsTab .table-container,
#reservationTab .table-container,
#shiftTab .table-container,
#recruitmentTab .table-container {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.7), rgba(20, 20, 50, 0.8));
    border-radius: 16px;
    padding: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow-x: auto;
}
#storeDailyTab .data-table thead th,
#castDailyTab .data-table thead th,
#customerTab .data-table thead th,
#customerAnalysisTab .data-table thead th,
#salaryTab .data-table thead th,
#maleStaffTab .data-table thead th,
#settingsTab .data-table thead th,
#reservationTab .data-table thead th,
#shiftTab .data-table thead th,
#recruitmentTab .data-table thead th {
    background: rgba(255, 255, 255, 0.06) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 0.75rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* 給与テーブル sticky header — ページスクロールでもヘッダー固定 */
#salaryTab .table-container {
    overflow-x: visible !important;
    overflow-y: visible !important;
    overflow: visible !important;
}
#salaryTab .data-table {
    overflow-x: auto;
}
#salaryTab .data-table thead th {
    position: sticky !important;
    top: 60px !important;
    z-index: 20 !important;
    background: #1e1e3a !important;
}
[data-theme="light"] #salaryTab .data-table thead th {
    background: #e8e8f0 !important;
    color: #333 !important;
    top: 60px !important;
}

#storeDailyTab .data-table tbody td,
#castDailyTab .data-table tbody td,
#customerTab .data-table tbody td,
#customerAnalysisTab .data-table tbody td,
#salaryTab .data-table tbody td,
#maleStaffTab .data-table tbody td,
#settingsTab .data-table tbody td,
#reservationTab .data-table tbody td,
#shiftTab .data-table tbody td,
#recruitmentTab .data-table tbody td {
    color: rgba(255, 255, 255, 0.9) !important;
    padding: 0.75rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.85rem;
}
#storeDailyTab .data-table tbody tr:hover,
#castDailyTab .data-table tbody tr:hover,
#customerTab .data-table tbody tr:hover,
#customerAnalysisTab .data-table tbody tr:hover,
#salaryTab .data-table tbody tr:hover,
#maleStaffTab .data-table tbody tr:hover,
#settingsTab .data-table tbody tr:hover,
#reservationTab .data-table tbody tr:hover,
#shiftTab .data-table tbody tr:hover,
#recruitmentTab .data-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.05);
}
#storeDailyTab .data-table .no-data,
#castDailyTab .data-table .no-data,
#customerTab .data-table .no-data,
#customerAnalysisTab .data-table .no-data,
#salaryTab .data-table .no-data,
#maleStaffTab .data-table .no-data,
#settingsTab .data-table .no-data,
#reservationTab .data-table .no-data,
#shiftTab .data-table .no-data,
#recruitmentTab .data-table .no-data {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* --- 共通: サマリーカード --- */
#storeDailyTab .summary-card,
#castDailyTab .summary-card,
#salaryTab .summary-card,
#maleStaffTab .summary-card,
#customerAnalysisTab .summary-card {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}
#storeDailyTab .summary-card:hover,
#castDailyTab .summary-card:hover,
#salaryTab .summary-card:hover,
#maleStaffTab .summary-card:hover,
#customerAnalysisTab .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
#storeDailyTab .summary-label,
#castDailyTab .summary-label,
#salaryTab .summary-label,
#maleStaffTab .summary-label,
#customerAnalysisTab .summary-label {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.8rem;
}
#storeDailyTab .summary-value,
#castDailyTab .summary-value,
#salaryTab .summary-value,
#maleStaffTab .summary-value,
#customerAnalysisTab .summary-value {
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
}
#storeDailyTab .summary-card.highlight,
#castDailyTab .summary-card.highlight,
#salaryTab .summary-card.highlight,
#maleStaffTab .summary-card.highlight {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border: none;
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4);
}

/* --- 共通: 給与フィルターボタン --- */
.salary-filter-btn {
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    transition: all 0.3s ease;
}
.salary-filter-btn:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
}
.salary-filter-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* --- 共通: 小テキスト・補助テキスト --- */
#storeDailyTab small,
#castDailyTab small,
#customerTab small,
#salaryTab small,
#maleStaffTab small,
#settingsTab small,
#reservationTab small,
#shiftTab small,
#recruitmentTab small {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* --- 共通: データリストセクション --- */
#storeDailyTab .data-list-section,
#castDailyTab .data-list-section,
#customerTab .data-list-section,
#salaryTab .data-list-section,
#maleStaffTab .data-list-section,
#settingsTab .data-list-section,
#reservationTab .data-list-section,
#shiftTab .data-list-section,
#recruitmentTab .data-list-section {
    margin-top: 1.5rem;
}

/* --- 設定タブ固有 --- */
#settingsTab .settings-section {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.6), rgba(20, 20, 50, 0.7));
    border-radius: 16px;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 1.5rem;
}
#settingsTab p {
    color: rgba(255, 255, 255, 0.6);
}

/* --- 共通: モーダル --- */
.modal-content {
    background: linear-gradient(145deg, #1a1a3e, #24243e) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 20px !important;
}
.modal-header {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
    border-radius: 20px 20px 0 0 !important;
}
.modal-header h3 {
    color: #fff !important;
}
.modal-body {
    color: rgba(255, 255, 255, 0.9);
}
.modal-body .form-group label {
    color: rgba(255, 255, 255, 0.8) !important;
}
.modal-body .form-group input,
.modal-body .form-group select,
.modal-body .form-group textarea {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
    border-radius: 10px;
}

/* =====================================================
   全タブ共通 - ライトテーマ
   ===================================================== */
[data-theme="light"] #storeDailyTab .form-container,
[data-theme="light"] #castDailyTab .form-container,
[data-theme="light"] #customerTab .form-container,
[data-theme="light"] #customerAnalysisTab .form-container,
[data-theme="light"] #salaryTab .form-container,
[data-theme="light"] #maleStaffTab .form-container,
[data-theme="light"] #settingsTab .form-container,
[data-theme="light"] #reservationTab .form-container,
[data-theme="light"] #shiftTab .form-container,
[data-theme="light"] #recruitmentTab .form-container {
    background: linear-gradient(135deg, #f0f4ff 0%, #e8edf5 50%, #f5f7fa 100%);
}

/* ライト: ヘッダー */
[data-theme="light"] #storeDailyTab .section-header h2,
[data-theme="light"] #castDailyTab .section-header h2,
[data-theme="light"] #customerTab .section-header h2,
[data-theme="light"] #customerAnalysisTab .section-header h2,
[data-theme="light"] #salaryTab .section-header h2,
[data-theme="light"] #maleStaffTab .section-header h2,
[data-theme="light"] #settingsTab .section-header h2,
[data-theme="light"] #reservationTab .section-header h2,
[data-theme="light"] #shiftTab .section-header h2,
[data-theme="light"] #recruitmentTab .section-header h2 {
    color: #1a202c;
    text-shadow: none;
}
[data-theme="light"] #storeDailyTab .section-header h2 i,
[data-theme="light"] #castDailyTab .section-header h2 i,
[data-theme="light"] #customerTab .section-header h2 i,
[data-theme="light"] #customerAnalysisTab .section-header h2 i,
[data-theme="light"] #salaryTab .section-header h2 i,
[data-theme="light"] #maleStaffTab .section-header h2 i,
[data-theme="light"] #settingsTab .section-header h2 i,
[data-theme="light"] #reservationTab .section-header h2 i,
[data-theme="light"] #shiftTab .section-header h2 i,
[data-theme="light"] #recruitmentTab .section-header h2 i {
    color: #7c3aed;
    filter: none;
}
[data-theme="light"] #storeDailyTab .section-header h3,
[data-theme="light"] #castDailyTab .section-header h3,
[data-theme="light"] #customerTab .section-header h3,
[data-theme="light"] #customerAnalysisTab .section-header h3,
[data-theme="light"] #salaryTab .section-header h3,
[data-theme="light"] #maleStaffTab .section-header h3,
[data-theme="light"] #settingsTab .section-header h3,
[data-theme="light"] #settingsTab .settings-section h3,
[data-theme="light"] #reservationTab .section-header h3,
[data-theme="light"] #shiftTab .section-header h3,
[data-theme="light"] #recruitmentTab .section-header h3 {
    color: #2d3748;
}
[data-theme="light"] #storeDailyTab .section-header h3 i,
[data-theme="light"] #castDailyTab .section-header h3 i,
[data-theme="light"] #customerTab .section-header h3 i,
[data-theme="light"] #customerAnalysisTab .section-header h3 i,
[data-theme="light"] #salaryTab .section-header h3 i,
[data-theme="light"] #maleStaffTab .section-header h3 i,
[data-theme="light"] #settingsTab .section-header h3 i,
[data-theme="light"] #reservationTab .section-header h3 i,
[data-theme="light"] #shiftTab .section-header h3 i,
[data-theme="light"] #recruitmentTab .section-header h3 i {
    color: #3498db;
}

/* ライト: 店舗フィルター */
[data-theme="light"] #storeDailyTab .store-filter .store-btn,
[data-theme="light"] #castDailyTab .store-filter .store-btn,
[data-theme="light"] #customerTab .store-filter .store-btn,
[data-theme="light"] #customerAnalysisTab .store-filter .store-btn,
[data-theme="light"] #salaryTab .store-filter .store-btn,
[data-theme="light"] #maleStaffTab .store-filter .store-btn,
[data-theme="light"] #reservationTab .store-filter .store-btn,
[data-theme="light"] #shiftTab .store-filter .store-btn,
[data-theme="light"] #recruitmentTab .store-filter .store-btn {
    background: rgba(0, 0, 0, 0.04);
    color: #4a5568;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
[data-theme="light"] #storeDailyTab .store-filter .store-btn:hover,
[data-theme="light"] #castDailyTab .store-filter .store-btn:hover,
[data-theme="light"] #customerTab .store-filter .store-btn:hover,
[data-theme="light"] #salaryTab .store-filter .store-btn:hover,
[data-theme="light"] #maleStaffTab .store-filter .store-btn:hover,
[data-theme="light"] #reservationTab .store-filter .store-btn:hover,
[data-theme="light"] #shiftTab .store-filter .store-btn:hover,
[data-theme="light"] #recruitmentTab .store-filter .store-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a202c;
}
[data-theme="light"] #storeDailyTab .store-filter .store-btn.active,
[data-theme="light"] #castDailyTab .store-filter .store-btn.active,
[data-theme="light"] #customerTab .store-filter .store-btn.active,
[data-theme="light"] #salaryTab .store-filter .store-btn.active,
[data-theme="light"] #maleStaffTab .store-filter .store-btn.active,
[data-theme="light"] #reservationTab .store-filter .store-btn.active,
[data-theme="light"] #shiftTab .store-filter .store-btn.active,
[data-theme="light"] #recruitmentTab .store-filter .store-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border-color: transparent;
}
[data-theme="light"] #storeDailyTab .store-filter .btn-icon,
[data-theme="light"] #castDailyTab .store-filter .btn-icon,
[data-theme="light"] #customerTab .store-filter .btn-icon,
[data-theme="light"] #salaryTab .store-filter .btn-icon,
[data-theme="light"] #maleStaffTab .store-filter .btn-icon,
[data-theme="light"] #reservationTab .store-filter .btn-icon,
[data-theme="light"] #shiftTab .store-filter .btn-icon {
    background: rgba(0, 0, 0, 0.04);
    color: #4a5568;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* ライト: フォーム */
[data-theme="light"] #storeDailyTab .form-group label,
[data-theme="light"] #castDailyTab .form-group label,
[data-theme="light"] #customerTab .form-group label,
[data-theme="light"] #salaryTab .form-group label,
[data-theme="light"] #maleStaffTab .form-group label,
[data-theme="light"] #settingsTab .form-group label,
[data-theme="light"] #reservationTab .form-group label,
[data-theme="light"] #shiftTab .form-group label,
[data-theme="light"] #recruitmentTab .form-group label {
    color: #4a5568;
}
[data-theme="light"] #storeDailyTab .form-group input,
[data-theme="light"] #storeDailyTab .form-group select,
[data-theme="light"] #storeDailyTab .form-group textarea,
[data-theme="light"] #castDailyTab .form-group input,
[data-theme="light"] #castDailyTab .form-group select,
[data-theme="light"] #castDailyTab .form-group textarea,
[data-theme="light"] #customerTab .form-group input,
[data-theme="light"] #customerTab .form-group select,
[data-theme="light"] #customerTab .form-group textarea,
[data-theme="light"] #salaryTab .form-group input,
[data-theme="light"] #salaryTab .form-group select,
[data-theme="light"] #maleStaffTab .form-group input,
[data-theme="light"] #maleStaffTab .form-group select,
[data-theme="light"] #settingsTab .form-group input,
[data-theme="light"] #settingsTab .form-group select,
[data-theme="light"] #reservationTab .form-group input,
[data-theme="light"] #reservationTab .form-group select,
[data-theme="light"] #reservationTab .form-group textarea,
[data-theme="light"] #shiftTab .form-group input,
[data-theme="light"] #shiftTab .form-group select,
[data-theme="light"] #recruitmentTab .form-group input,
[data-theme="light"] #recruitmentTab .form-group select,
[data-theme="light"] #recruitmentTab .form-group textarea {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #1a202c !important;
}
[data-theme="light"] #storeDailyTab .form-group input::placeholder,
[data-theme="light"] #castDailyTab .form-group input::placeholder,
[data-theme="light"] #customerTab .form-group input::placeholder,
[data-theme="light"] #salaryTab .form-group input::placeholder,
[data-theme="light"] #maleStaffTab .form-group input::placeholder,
[data-theme="light"] #settingsTab .form-group input::placeholder,
[data-theme="light"] #reservationTab .form-group input::placeholder,
[data-theme="light"] #shiftTab .form-group input::placeholder,
[data-theme="light"] #recruitmentTab .form-group input::placeholder {
    color: #a0aec0 !important;
}

/* ライト: ボタン */
[data-theme="light"] #storeDailyTab .btn-secondary,
[data-theme="light"] #castDailyTab .btn-secondary,
[data-theme="light"] #customerTab .btn-secondary,
[data-theme="light"] #salaryTab .btn-secondary,
[data-theme="light"] #maleStaffTab .btn-secondary,
[data-theme="light"] #settingsTab .btn-secondary,
[data-theme="light"] #reservationTab .btn-secondary,
[data-theme="light"] #shiftTab .btn-secondary,
[data-theme="light"] #recruitmentTab .btn-secondary {
    background: rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #4a5568 !important;
}

/* ライト: テーブル */
[data-theme="light"] #storeDailyTab .table-container,
[data-theme="light"] #castDailyTab .table-container,
[data-theme="light"] #customerTab .table-container,
[data-theme="light"] #customerAnalysisTab .table-container,
[data-theme="light"] #salaryTab .table-container,
[data-theme="light"] #maleStaffTab .table-container,
[data-theme="light"] #settingsTab .table-container,
[data-theme="light"] #reservationTab .table-container,
[data-theme="light"] #shiftTab .table-container,
[data-theme="light"] #recruitmentTab .table-container {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] #storeDailyTab .data-table thead th,
[data-theme="light"] #castDailyTab .data-table thead th,
[data-theme="light"] #customerTab .data-table thead th,
[data-theme="light"] #customerAnalysisTab .data-table thead th,
[data-theme="light"] #salaryTab .data-table thead th,
[data-theme="light"] #maleStaffTab .data-table thead th,
[data-theme="light"] #settingsTab .data-table thead th,
[data-theme="light"] #reservationTab .data-table thead th,
[data-theme="light"] #shiftTab .data-table thead th,
[data-theme="light"] #recruitmentTab .data-table thead th {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #718096 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] #storeDailyTab .data-table tbody td,
[data-theme="light"] #castDailyTab .data-table tbody td,
[data-theme="light"] #customerTab .data-table tbody td,
[data-theme="light"] #customerAnalysisTab .data-table tbody td,
[data-theme="light"] #salaryTab .data-table tbody td,
[data-theme="light"] #maleStaffTab .data-table tbody td,
[data-theme="light"] #settingsTab .data-table tbody td,
[data-theme="light"] #reservationTab .data-table tbody td,
[data-theme="light"] #shiftTab .data-table tbody td,
[data-theme="light"] #recruitmentTab .data-table tbody td {
    color: #2d3748 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
[data-theme="light"] #storeDailyTab .data-table tbody tr:hover,
[data-theme="light"] #castDailyTab .data-table tbody tr:hover,
[data-theme="light"] #customerTab .data-table tbody tr:hover,
[data-theme="light"] #customerAnalysisTab .data-table tbody tr:hover,
[data-theme="light"] #salaryTab .data-table tbody tr:hover,
[data-theme="light"] #maleStaffTab .data-table tbody tr:hover,
[data-theme="light"] #settingsTab .data-table tbody tr:hover,
[data-theme="light"] #reservationTab .data-table tbody tr:hover,
[data-theme="light"] #shiftTab .data-table tbody tr:hover,
[data-theme="light"] #recruitmentTab .data-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.03);
}
[data-theme="light"] #storeDailyTab .data-table .no-data,
[data-theme="light"] #castDailyTab .data-table .no-data,
[data-theme="light"] #customerTab .data-table .no-data,
[data-theme="light"] #customerAnalysisTab .data-table .no-data,
[data-theme="light"] #salaryTab .data-table .no-data,
[data-theme="light"] #maleStaffTab .data-table .no-data,
[data-theme="light"] #settingsTab .data-table .no-data,
[data-theme="light"] #reservationTab .data-table .no-data,
[data-theme="light"] #shiftTab .data-table .no-data,
[data-theme="light"] #recruitmentTab .data-table .no-data {
    color: #a0aec0 !important;
}

/* ライト: サマリーカード */
[data-theme="light"] #storeDailyTab .summary-card,
[data-theme="light"] #castDailyTab .summary-card,
[data-theme="light"] #salaryTab .summary-card,
[data-theme="light"] #maleStaffTab .summary-card,
[data-theme="light"] #customerAnalysisTab .summary-card {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
[data-theme="light"] #storeDailyTab .summary-label,
[data-theme="light"] #castDailyTab .summary-label,
[data-theme="light"] #salaryTab .summary-label,
[data-theme="light"] #maleStaffTab .summary-label,
[data-theme="light"] #customerAnalysisTab .summary-label {
    color: #718096;
}
[data-theme="light"] #storeDailyTab .summary-value,
[data-theme="light"] #castDailyTab .summary-value,
[data-theme="light"] #salaryTab .summary-value,
[data-theme="light"] #maleStaffTab .summary-value,
[data-theme="light"] #customerAnalysisTab .summary-value {
    color: #1a202c;
}
[data-theme="light"] #storeDailyTab .summary-card.highlight,
[data-theme="light"] #castDailyTab .summary-card.highlight,
[data-theme="light"] #salaryTab .summary-card.highlight,
[data-theme="light"] #maleStaffTab .summary-card.highlight {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

/* ライト: 給与フィルター */
[data-theme="light"] .salary-filter-btn {
    background: rgba(0, 0, 0, 0.04) !important;
    color: #4a5568 !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}
[data-theme="light"] .salary-filter-btn:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    color: #1a202c !important;
}
[data-theme="light"] .salary-filter-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: #fff !important;
}

/* ライト: 小テキスト */
[data-theme="light"] #storeDailyTab small,
[data-theme="light"] #castDailyTab small,
[data-theme="light"] #customerTab small,
[data-theme="light"] #salaryTab small,
[data-theme="light"] #maleStaffTab small,
[data-theme="light"] #settingsTab small,
[data-theme="light"] #reservationTab small,
[data-theme="light"] #shiftTab small,
[data-theme="light"] #recruitmentTab small {
    color: #718096 !important;
}

/* ライト: 設定タブ */
[data-theme="light"] #settingsTab .settings-section {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] #settingsTab p {
    color: #718096;
}

/* ライト: モーダル */
[data-theme="light"] .modal-content {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}
[data-theme="light"] .modal-header {
    background: linear-gradient(135deg, #f0f4ff, #e8edf5) !important;
    color: #1a202c !important;
}
[data-theme="light"] .modal-header h3 {
    color: #1a202c !important;
}
[data-theme="light"] .modal-body {
    color: #2d3748;
}
[data-theme="light"] .modal-body .form-group label {
    color: #4a5568 !important;
}
[data-theme="light"] .modal-body .form-group input,
[data-theme="light"] .modal-body .form-group select,
[data-theme="light"] .modal-body .form-group textarea {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #1a202c !important;
}

/* =====================================================
   利益タブ - モダンダークテーマ
   ===================================================== */
#profitTab .form-container {
    background: linear-gradient(135deg, #0f0c29 0%, #1a1a3e 50%, #24243e 100%);
    border-radius: 24px;
    padding: 2rem;
    min-height: calc(100vh - 200px);
}

#profitTab .section-header h2 {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
    text-shadow: 0 0 20px rgba(102, 126, 234, 0.3);
}
#profitTab .section-header h2 i {
    color: #a855f7;
    filter: drop-shadow(0 0 8px rgba(168, 85, 247, 0.5));
}
#profitTab .section-header h3 {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.1rem;
}
#profitTab .section-header h3 i {
    color: #00d4ff;
}

/* 店舗フィルターボタン */
#profitTab .store-filter .store-btn {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 0.5rem 1.2rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
}
#profitTab .store-filter .store-btn:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}
#profitTab .store-filter .store-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}
#profitTab .store-filter .btn-icon {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    padding: 0.5rem 0.8rem;
    cursor: pointer;
    transition: all 0.3s ease;
}
#profitTab .store-filter .btn-icon:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* 利益サマリーカード */
#profitTab .summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
}
#profitTab .summary-card {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.9), rgba(20, 20, 50, 0.95));
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
}
#profitTab .summary-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
#profitTab .summary-label {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.8rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    letter-spacing: 0.5px;
}
#profitTab .summary-value {
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
}
#profitTab .summary-card.highlight {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border: none;
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.4);
}
#profitTab .summary-card.highlight .summary-label {
    color: rgba(255, 255, 255, 0.85);
}
#profitTab .summary-card.highlight .summary-value {
    font-size: 1.6rem;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
#profitTab .summary-breakdown {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 0.7rem !important;
}

/* フォーム */
#profitTab .input-form .form-group label {
    color: rgba(255, 255, 255, 0.8);
    font-weight: 500;
}
#profitTab .input-form .form-group label .required {
    color: #ef4444;
}
#profitTab .input-form input,
#profitTab .input-form select {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
    border-radius: 10px;
}
#profitTab .input-form input::placeholder {
    color: rgba(255, 255, 255, 0.35) !important;
}
#profitTab .input-form input:focus,
#profitTab .input-form select:focus {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.2) !important;
}
#profitTab .btn-primary {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    border: none;
    color: #fff;
    border-radius: 10px;
    padding: 0.6rem 1.5rem;
    font-weight: 600;
    transition: all 0.3s ease;
}
#profitTab .btn-primary:hover {
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.5);
    transform: translateY(-1px);
}
#profitTab .btn-secondary {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.8) !important;
    border-radius: 10px;
}

/* テーブル */
#profitTab .data-table {
    border-collapse: collapse;
    width: 100%;
}
#profitTab .data-table thead th {
    background: rgba(255, 255, 255, 0.06) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 0.75rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#profitTab .data-table tbody td {
    color: rgba(255, 255, 255, 0.9) !important;
    padding: 0.75rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.85rem;
}
#profitTab .data-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.05);
}
#profitTab .data-table .no-data {
    color: rgba(255, 255, 255, 0.4) !important;
}
#profitTab .table-container {
    background: linear-gradient(145deg, rgba(30, 30, 60, 0.7), rgba(20, 20, 50, 0.8));
    border-radius: 16px;
    padding: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow-x: auto;
}

/* 利益タブ スクロールバー */
#profitTab ::-webkit-scrollbar { width: 6px; height: 6px; }
#profitTab ::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); border-radius: 3px; }
#profitTab ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.2); border-radius: 3px; }

/* =====================================================
   利益タブ - ライトテーマ
   ===================================================== */
[data-theme="light"] #profitTab .form-container {
    background: linear-gradient(135deg, #f0f4ff 0%, #e8edf5 50%, #f5f7fa 100%);
}
[data-theme="light"] #profitTab .section-header h2 {
    color: #1a202c;
    text-shadow: none;
}
[data-theme="light"] #profitTab .section-header h2 i {
    color: #7c3aed;
    filter: none;
}
[data-theme="light"] #profitTab .section-header h3 {
    color: #2d3748;
}
[data-theme="light"] #profitTab .section-header h3 i {
    color: #3498db;
}

[data-theme="light"] #profitTab .store-filter .store-btn {
    background: rgba(0, 0, 0, 0.04);
    color: #4a5568;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
[data-theme="light"] #profitTab .store-filter .store-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a202c;
}
[data-theme="light"] #profitTab .store-filter .store-btn.active {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
    border-color: transparent;
}
[data-theme="light"] #profitTab .store-filter .btn-icon {
    background: rgba(0, 0, 0, 0.04);
    color: #4a5568;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

[data-theme="light"] #profitTab .summary-card {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
[data-theme="light"] #profitTab .summary-label {
    color: #718096;
}
[data-theme="light"] #profitTab .summary-value {
    color: #1a202c;
}
[data-theme="light"] #profitTab .summary-card.highlight {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}
[data-theme="light"] #profitTab .summary-card.highlight .summary-label {
    color: rgba(255, 255, 255, 0.85);
}
[data-theme="light"] #profitTab .summary-card.highlight .summary-value {
    color: #fff;
}
[data-theme="light"] #profitTab .summary-breakdown {
    color: #718096 !important;
}

[data-theme="light"] #profitTab .input-form input,
[data-theme="light"] #profitTab .input-form select {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #1a202c !important;
}
[data-theme="light"] #profitTab .input-form input::placeholder {
    color: #a0aec0 !important;
}
[data-theme="light"] #profitTab .input-form .form-group label {
    color: #4a5568;
}
[data-theme="light"] #profitTab .btn-secondary {
    background: rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #4a5568 !important;
}

[data-theme="light"] #profitTab .table-container {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] #profitTab .data-table thead th {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #718096 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] #profitTab .data-table tbody td {
    color: #2d3748 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
[data-theme="light"] #profitTab .data-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.03);
}
[data-theme="light"] #profitTab .data-table .no-data {
    color: #a0aec0 !important;
}

[data-theme="light"] #profitTab ::-webkit-scrollbar-track { background: rgba(0,0,0,0.04); }
[data-theme="light"] #profitTab ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); }

/* =====================================================
   ライトテーマ - ダッシュボード
   ===================================================== */
[data-theme="light"] #dashboardTab {
    background: linear-gradient(135deg, #f0f4ff 0%, #e8edf5 50%, #f5f7fa 100%);
}

/* 店舗カード */
[data-theme="light"] .store-card-compact {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}
[data-theme="light"] .store-card-compact .card-header span,
[data-theme="light"] .store-card-compact h4 {
    color: #4a5568 !important;
}
[data-theme="light"] .store-card-compact .big-value {
    color: #1a202c !important;
}
[data-theme="light"] .store-card-compact .card-metrics span,
[data-theme="light"] .store-card-compact .card-metrics strong,
[data-theme="light"] .store-card-compact .metrics span,
[data-theme="light"] .store-card-compact .metrics strong,
[data-theme="light"] .store-card-compact .metric-label,
[data-theme="light"] .store-card-compact .metric-value,
[data-theme="light"] .store-card-compact .mom-badge {
    color: #4a5568 !important;
}

/* CUORE ライト */
[data-theme="light"] .store-card-compact:nth-child(1) {
    border-top: 3px solid #e67e22;
}
[data-theme="light"] .store-card-compact:nth-child(1) .big-value {
    color: #e67e22 !important;
}

/* ARISE ライト */
[data-theme="light"] .store-card-compact:nth-child(2) {
    border-top: 3px solid #3498db;
}
[data-theme="light"] .store-card-compact:nth-child(2) .big-value {
    color: #3498db !important;
}

/* AGEHA ライト */
[data-theme="light"] .store-card-compact:nth-child(3) {
    border-top: 3px solid #9b59b6;
}
[data-theme="light"] .store-card-compact:nth-child(3) .big-value {
    color: #9b59b6 !important;
}

/* 合算 ライト */
[data-theme="light"] .store-card-compact:nth-child(4) {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    border-top: none;
}
[data-theme="light"] .store-card-compact:nth-child(4) .card-header span,
[data-theme="light"] .store-card-compact:nth-child(4) .big-value,
[data-theme="light"] .store-card-compact:nth-child(4) .card-metrics span,
[data-theme="light"] .store-card-compact:nth-child(4) .card-metrics strong {
    color: #fff !important;
}

/* 週次サマリーセクション */
[data-theme="light"] .weekly-summary-section {
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .weekly-summary-section h4 {
    color: #2d3748 !important;
}

/* 週次カード */
[data-theme="light"] .weekly-card {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(0, 0, 0, 0.06);
}
[data-theme="light"] .weekly-card h5 {
    color: #4a5568 !important;
}
[data-theme="light"] .weekly-card > div:nth-child(2) {
    color: #1a202c !important;
}
[data-theme="light"] .weekly-card span {
    color: #718096 !important;
}
[data-theme="light"] .weekly-card strong {
    color: #2d3748 !important;
}

/* 週次 CUORE */
[data-theme="light"] .weekly-card:nth-child(1) {
    border-left: 3px solid #e67e22;
}
[data-theme="light"] .weekly-card:nth-child(1) h5 { color: #e67e22 !important; }

/* 週次 ARISE */
[data-theme="light"] .weekly-card:nth-child(2) {
    border-left: 3px solid #3498db;
}
[data-theme="light"] .weekly-card:nth-child(2) h5 { color: #3498db !important; }

/* 週次 AGEHA */
[data-theme="light"] .weekly-card:nth-child(3) {
    border-left: 3px solid #9b59b6;
}
[data-theme="light"] .weekly-card:nth-child(3) h5 { color: #9b59b6 !important; }

/* 週次 合算 */
[data-theme="light"] .weekly-card:nth-child(4) {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    border-left: none;
}
[data-theme="light"] .weekly-card:nth-child(4) h5,
[data-theme="light"] .weekly-card:nth-child(4) > div:nth-child(2),
[data-theme="light"] .weekly-card:nth-child(4) span,
[data-theme="light"] .weekly-card:nth-child(4) strong {
    color: #fff !important;
}

/* アラートパネル */
[data-theme="light"] .alert-panel {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .alert-panel h4 {
    color: #2d3748 !important;
}
[data-theme="light"] .alert-count {
    background: rgba(0, 0, 0, 0.04) !important;
    color: #4a5568 !important;
}
[data-theme="light"] .alert-count .count {
    color: #1a202c !important;
}

/* 予約パネル */
[data-theme="light"] .reservation-panel {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .reservation-panel h5 {
    color: #2d3748 !important;
}

/* チャート */
[data-theme="light"] .chart-box {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .chart-box h5 {
    color: #2d3748 !important;
}

/* スタッフセクション */
[data-theme="light"] .staff-section {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
[data-theme="light"] .staff-section h4 {
    color: #2d3748 !important;
}
[data-theme="light"] .staff-badge {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #4a5568 !important;
}

/* プログレスバー */
[data-theme="light"] .progress-bar {
    background: rgba(0, 0, 0, 0.08) !important;
}

/* 異常検知パネル */
[data-theme="light"] .alert-panel-compact {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}
[data-theme="light"] .alert-panel-compact h5 {
    color: #2d3748 !important;
}
[data-theme="light"] .alert-panel-compact h5 i {
    filter: none !important;
}
[data-theme="light"] .alert-list-compact .no-alerts {
    color: #a0aec0 !important;
}
[data-theme="light"] .alert-count {
    background: rgba(0, 0, 0, 0.04) !important;
}
[data-theme="light"] .alert-item-compact {
    color: #2d3748 !important;
}
[data-theme="light"] .alert-item-compact.red {
    background: rgba(239, 68, 68, 0.08) !important;
}
[data-theme="light"] .alert-item-compact.yellow {
    background: rgba(245, 158, 11, 0.08) !important;
}
[data-theme="light"] .alert-item-compact.flag {
    background: rgba(59, 130, 246, 0.08) !important;
}

/* 当月スタッフ実績 */
[data-theme="light"] .staff-section-compact {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}
[data-theme="light"] .staff-section-compact h5 {
    color: #2d3748 !important;
}
[data-theme="light"] .staff-section-compact h5 i {
    color: #3498db !important;
    filter: none !important;
}
[data-theme="light"] .staff-table-compact th {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #718096 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}
[data-theme="light"] .staff-table-compact td {
    color: #2d3748 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}
[data-theme="light"] .staff-table-compact tbody tr:hover {
    background: rgba(0, 0, 0, 0.03) !important;
}
[data-theme="light"] .staff-table-compact .no-data {
    color: #a0aec0 !important;
}

/* 本日の予約 */
[data-theme="light"] .reservation-section-compact {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}
[data-theme="light"] .reservation-section-compact h5 {
    color: #2d3748 !important;
}
[data-theme="light"] .reservation-section-compact h5 i {
    color: #10b981 !important;
    filter: none !important;
}
[data-theme="light"] .reservation-section-compact h5 span {
    color: #a0aec0 !important;
}
[data-theme="light"] .reservation-list-compact .no-data {
    color: #a0aec0 !important;
}

/* スクロールバー */
[data-theme="light"] #dashboardTab ::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.04);
}
[data-theme="light"] #dashboardTab ::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
}
[data-theme="light"] #dashboardTab ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* ========================================
   勤怠管理タブ
   ======================================== */
.att-badge{display:inline-block;padding:2px 10px;border-radius:12px;font-size:12px;font-weight:600;white-space:nowrap}
.att-normal{background:#10b98122;color:#10b981}
.att-late{background:#f59e0b22;color:#f59e0b}
.att-early{background:#8b5cf622;color:#8b5cf6}
.att-absent-n{background:#f9731622;color:#f97316}
.att-absent{background:#ef444422;color:#ef4444}

.att-status-select{padding:4px 6px;border-radius:4px;border:1px solid var(--border-color,#ddd);background:var(--input-bg,#fff);color:var(--text-color,#333);font-size:12px}
[data-theme="dark"] .att-status-select{border-color:#444;background:#1a1a2e;color:#e0e0e0}

.qr-store-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#ddd);border-radius:10px;padding:16px;text-align:center}
[data-theme="dark"] .qr-store-card{background:#1a1a2e;border-color:#333}
.qr-store-card h4{margin-bottom:8px;font-size:16px}
.qr-image-area{min-height:40px;display:flex;align-items:center;justify-content:center}

/* Shift calendar grid */
.shift-cal-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}
.shift-cal-table{font-size:11px;white-space:nowrap;border-collapse:collapse}
.shift-cal-table th,.shift-cal-table td{padding:4px 6px;border:1px solid var(--border-color,#ddd);text-align:center;min-width:50px}
[data-theme="dark"] .shift-cal-table th,[data-theme="dark"] .shift-cal-table td{border-color:#333}
.shift-cal-table .staff-name-cell{text-align:left;font-weight:600;position:sticky;left:0;background:var(--card-bg,#fff);z-index:1;min-width:80px}
[data-theme="dark"] .shift-cal-table .staff-name-cell{background:#1a1a2e}
.shift-cal-table .sun{color:#ef4444}
.shift-cal-table .sat{color:#3b82f6}
.shift-cell.has-shift{background:#10b98118;font-size:10px;line-height:1.3}
[data-theme="dark"] .shift-cell.has-shift{background:#10b98122}

/* ========================================
   共有タイマーシステム
   ======================================== */
.timer-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.timer-card{background:var(--card-bg,#fff);border-radius:12px;padding:1.2rem;box-shadow:0 2px 8px rgba(0,0,0,.1);border-left:5px solid #3b82f6;transition:all .3s}
.timer-card.timer-warning{border-left-color:#f59e0b;background:linear-gradient(135deg,#fffbeb,#fef3c7)}
.timer-card.timer-danger{border-left-color:#ef4444;background:linear-gradient(135deg,#fef2f2,#fecaca);animation:timer-pulse 1s infinite}
@keyframes timer-pulse{0%,100%{opacity:1}50%{opacity:.85}}
.timer-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}
.timer-table-name{font-weight:700;font-size:1.1rem;color:var(--text-primary)}
.timer-store-badge{background:#3b82f6;color:#fff;padding:2px 8px;border-radius:4px;font-size:.75rem;font-weight:600}
.timer-countdown{font-size:3rem;font-weight:800;text-align:center;font-family:'Courier New',monospace;line-height:1.2;margin:.5rem 0;color:#1e40af}
.timer-countdown.timer-warning{color:#b45309}
.timer-countdown.timer-danger{color:#dc2626}
.timer-paused-badge{display:block;text-align:center;color:#6b7280;font-size:.85rem;font-weight:600;margin-bottom:.3rem}
.timer-progress-bar{width:100%;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden;margin-bottom:.8rem}
.timer-progress-fill{height:100%;border-radius:4px;transition:width 1s linear;background:#3b82f6}
.timer-progress-fill.timer-warning{background:#f59e0b}
.timer-progress-fill.timer-danger{background:#ef4444}
.timer-card-info{font-size:.85rem;color:var(--text-secondary);display:flex;flex-direction:column;gap:.2rem;margin-bottom:.8rem}
.timer-card-info i{width:16px;text-align:center;margin-right:4px}
.timer-card-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.timer-card-actions .btn-sm{padding:4px 10px;font-size:.78rem;border-radius:6px}
/* Dark theme */
[data-theme="dark"] .timer-card{background:var(--card-bg,#1e1e2e);border-left-color:#60a5fa}
[data-theme="dark"] .timer-card.timer-warning{background:linear-gradient(135deg,#451a03,#78350f);border-left-color:#fbbf24}
[data-theme="dark"] .timer-card.timer-danger{background:linear-gradient(135deg,#450a0a,#7f1d1d);border-left-color:#f87171}
[data-theme="dark"] .timer-countdown{color:#93c5fd}
[data-theme="dark"] .timer-countdown.timer-warning{color:#fcd34d}
[data-theme="dark"] .timer-countdown.timer-danger{color:#fca5a5}
[data-theme="dark"] .timer-progress-bar{background:#374151}


/* Phase E: Discord通知 */
.badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:0.75rem; font-weight:600; }
.badge-success { background:#27ae60; color:white; }
.badge-danger { background:#e74c3c; color:white; }
.badge-secondary { background:#95a5a6; color:white; }
.checkbox-label { display:inline-flex; align-items:center; gap:6px; cursor:pointer; padding:4px 0; }
.checkbox-label input[type="checkbox"] { width:16px; height:16px; cursor:pointer; }
.btn-sm { padding:4px 10px; font-size:0.8rem; border:none; border-radius:4px; cursor:pointer; }
.btn-danger { background:#e74c3c; color:white; border:none; border-radius:4px; padding:6px 12px; cursor:pointer; }
.btn-danger:hover { background:#c0392b; }
[data-theme="dark"] .badge-secondary { background:#666; }
[data-theme="dark"] .badge-success { background:#219a52; }

/* ========================================
   Phase G: リアルタイムダッシュボード
   ======================================== */
.realtime-dashboard-section{margin-top:1.5rem;padding-top:1rem;border-top:2px solid rgba(255,255,255,0.1)}
.realtime-dashboard-section .section-title{font-size:1.1rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:6px}
.realtime-dashboard-section .section-title i{color:#60a5fa}

/* Top Cards */
.rt-top-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:1.2rem}
.rt-card{background:linear-gradient(135deg,#1e293b 0%,#334155 100%);border-radius:12px;padding:16px;text-align:center;border:1px solid rgba(255,255,255,0.08);transition:transform .2s,box-shadow .2s}
.rt-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.3)}
.rt-card-label{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.5px;opacity:0.7;margin-bottom:4px}
.rt-card-value{font-size:1.8rem;font-weight:800;line-height:1.1}
.rt-card-sub{font-size:0.7rem;opacity:0.5;margin-top:4px}
.rt-card-blue .rt-card-value{color:#60a5fa}
.rt-card-accent .rt-card-value{color:#34d399}
.rt-card-goal .rt-card-value{color:#fbbf24}
.rt-progress-bar{height:6px;background:rgba(255,255,255,0.1);border-radius:3px;margin-top:8px;overflow:hidden}
.rt-progress-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#22c55e);border-radius:3px;transition:width .8s ease}

/* Store Cards */
.rt-store-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:1.2rem}
.rt-store-card{background:linear-gradient(135deg,#1e293b 0%,#334155 100%);border-radius:12px;padding:16px;border-left:4px solid #3b82f6;transition:all .3s}
.rt-store-card h4{font-size:0.85rem;margin:0 0 8px;display:flex;align-items:center;gap:6px}
.rt-store-sales{font-size:1.5rem;font-weight:800;color:#fff;margin-bottom:8px}
.rt-store-metrics{display:flex;gap:12px;font-size:0.75rem}
.rt-store-metrics div{display:flex;flex-direction:column;align-items:center}
.rt-store-metrics span{opacity:0.6;font-size:0.65rem}
.rt-store-metrics strong{font-size:1rem;color:#e2e8f0}
.rt-store-goal-bar{height:4px;background:rgba(255,255,255,0.1);border-radius:2px;margin-top:10px;overflow:hidden}
.rt-store-goal-bar .rt-progress-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#22c55e);border-radius:2px;transition:width .8s ease}
.rt-status-green{border-left-color:#22c55e !important}
.rt-status-green .rt-store-sales{color:#4ade80}
.rt-status-yellow{border-left-color:#f59e0b !important}
.rt-status-yellow .rt-store-sales{color:#fbbf24}
.rt-status-red{border-left-color:#ef4444 !important}
.rt-status-red .rt-store-sales{color:#f87171}

/* Bar Charts */
.rt-section-box{background:linear-gradient(135deg,#1e293b 0%,#334155 100%);border-radius:12px;padding:16px;margin-bottom:1rem;border:1px solid rgba(255,255,255,0.05)}
.rt-section-box h5{font-size:0.85rem;margin:0 0 12px;display:flex;align-items:center;gap:6px;opacity:0.9}
.rt-bar-chart{display:flex;gap:4px;align-items:flex-end;height:180px;padding-bottom:24px;position:relative}
.rt-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}
.rt-bar-col-wide{min-width:60px}
.rt-bar-value{font-size:0.55rem;opacity:0.6;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.rt-bar-wrap{height:140px;width:70%;display:flex;align-items:flex-end;justify-content:center}
.rt-bar{width:100%;background:linear-gradient(180deg,#3b82f6,#1d4ed8);border-radius:4px 4px 0 0;transition:height .6s ease;min-height:2px}
.rt-bar-label{font-size:0.6rem;opacity:0.5;margin-top:4px;white-space:nowrap}
.rt-bar-dual{gap:3px;justify-content:center}
.rt-bar-dual .rt-bar{width:45%}
.rt-bar-prev{background:linear-gradient(180deg,#6b7280,#4b5563) !important;opacity:0.5}
.rt-bar-cur{background:linear-gradient(180deg,#3b82f6,#1d4ed8) !important}
.rt-legend{display:flex;gap:16px;justify-content:center;margin-top:8px;font-size:0.7rem;opacity:0.7}
.rt-legend-cur::before,.rt-legend-prev::before{content:'';display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:4px;vertical-align:middle}
.rt-legend-cur::before{background:#3b82f6}
.rt-legend-prev::before{background:#6b7280}

/* Rankings */
.rt-rankings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:1rem}
.rt-rank-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,0.05)}
.rt-rank-item:last-child{border-bottom:none}
.rt-rank-pos{font-size:1rem;min-width:28px;text-align:center}
.rt-rank-name{min-width:80px;font-size:0.8rem;font-weight:600}
.rt-rank-name small{display:block;font-size:0.6rem;opacity:0.5;font-weight:400}
.rt-rank-bar-wrap{flex:1;height:8px;background:rgba(255,255,255,0.08);border-radius:4px;overflow:hidden}
.rt-rank-bar{height:100%;background:linear-gradient(90deg,#3b82f6,#60a5fa);border-radius:4px;transition:width .6s ease}
.rt-rank-bar-green{background:linear-gradient(90deg,#22c55e,#4ade80) !important}
.rt-rank-val{font-size:0.75rem;font-weight:700;min-width:70px;text-align:right}

/* Responsive */
@media(max-width:768px){
.rt-top-cards{grid-template-columns:repeat(2,1fr)}
.rt-store-cards{grid-template-columns:1fr}
.rt-rankings-grid{grid-template-columns:1fr}
.rt-card-value{font-size:1.3rem}
.rt-bar-chart{height:140px}
}

/* Light theme */
[data-theme="light"] .realtime-dashboard-section{border-top-color:rgba(0,0,0,0.1)}
[data-theme="light"] .rt-card{background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-color:rgba(0,0,0,0.08)}
[data-theme="light"] .rt-card:hover{box-shadow:0 8px 24px rgba(0,0,0,0.1)}
[data-theme="light"] .rt-card-value{color:#1e40af}
[data-theme="light"] .rt-card-accent .rt-card-value{color:#059669}
[data-theme="light"] .rt-card-goal .rt-card-value{color:#d97706}
[data-theme="light"] .rt-store-card{background:linear-gradient(135deg,#f8fafc,#e2e8f0)}
[data-theme="light"] .rt-store-sales{color:#1e293b}
[data-theme="light"] .rt-store-metrics strong{color:#334155}
[data-theme="light"] .rt-section-box{background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-color:rgba(0,0,0,0.05)}
[data-theme="light"] .rt-status-green .rt-store-sales{color:#16a34a}
[data-theme="light"] .rt-status-yellow .rt-store-sales{color:#ca8a04}
[data-theme="light"] .rt-status-red .rt-store-sales{color:#dc2626}
[data-theme="light"] .rt-card-blue .rt-card-value{color:#1e40af}

/* ========================================
   LINE管理タブ
   ======================================== */
.line-dashboard-cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px; margin-bottom:20px; }
.line-card { display:flex; align-items:center; gap:12px; background:var(--card-bg, #fff); border:1px solid var(--border-color, #e0e0e0); border-radius:10px; padding:16px; border-left:4px solid #06C755; }
.line-card-icon { font-size:1.8rem; color:#06C755; width:40px; text-align:center; }
.line-card-body { flex:1; }
.line-card-label { font-size:0.8rem; color:var(--text-secondary, #888); margin-bottom:2px; }
.line-card-value { font-size:1.5rem; font-weight:bold; color:var(--text-primary, #222); }
.line-card-diff { font-size:0.75rem; }
.line-card-diff.positive { color:#06C755; }
.line-card-diff.negative { color:#dc2626; }
.line-card-sub { font-size:0.75rem; color:var(--text-secondary, #888); }

.line-sub-tabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:2px solid var(--border-color, #e0e0e0); padding-bottom:0; }
.line-sub-tab { padding:8px 16px; border:none; background:none; cursor:pointer; font-size:0.9rem; color:var(--text-secondary, #888); border-bottom:3px solid transparent; margin-bottom:-2px; transition:all 0.2s; }
.line-sub-tab:hover { color:#06C755; }
.line-sub-tab.active { color:#06C755; border-bottom-color:#06C755; font-weight:bold; }

.line-section { display:none; }
.line-section.active { display:block; }
.line-section.hidden { display:none; }

.line-store-month-bar { display:flex; gap:8px; align-items:center; margin-bottom:12px; flex-wrap:wrap; }
.line-store-month-bar select, .line-store-month-bar input[type="month"] { padding:6px 10px; border:1px solid var(--border-color, #ccc); border-radius:6px; background:var(--input-bg, #fff); color:var(--text-primary, #222); }

/* CSSバーチャート */
.line-chart-title { font-weight:bold; margin-bottom:8px; color:var(--text-primary, #222); }
.line-chart-bars { display:flex; align-items:flex-end; gap:4px; height:180px; padding:10px 0; overflow-x:auto; }
.line-chart-col { display:flex; flex-direction:column; align-items:center; min-width:32px; flex:1; }
.line-chart-val { font-size:0.65rem; color:var(--text-secondary, #888); margin-bottom:2px; white-space:nowrap; }
.line-chart-bar { width:100%; max-width:28px; background:linear-gradient(180deg, #06C755 0%, #04a648 100%); border-radius:4px 4px 0 0; min-height:2px; transition:height 0.3s; }
.line-chart-label { font-size:0.6rem; color:var(--text-secondary, #888); margin-top:4px; white-space:nowrap; }

/* 集客分析サマリー */
.line-analytics-summary { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:10px; margin-bottom:16px; }
.line-analytics-card { background:var(--card-bg, #fff); border:1px solid var(--border-color, #e0e0e0); border-radius:8px; padding:14px; text-align:center; }
.line-analytics-label { font-size:0.8rem; color:var(--text-secondary, #888); margin-bottom:4px; }
.line-analytics-value { font-size:1.3rem; font-weight:bold; color:#06C755; }

/* ダークテーマ対応 */
[data-theme="dark"] .line-card { background:var(--card-bg, #1e1e1e); border-color:var(--border-color, #333); }
[data-theme="dark"] .line-card-value { color:var(--text-primary, #e0e0e0); }
[data-theme="dark"] .line-analytics-card { background:var(--card-bg, #1e1e1e); border-color:var(--border-color, #333); }
[data-theme="dark"] .line-chart-title { color:var(--text-primary, #e0e0e0); }
[data-theme="dark"] .line-store-month-bar select, [data-theme="dark"] .line-store-month-bar input[type="month"] { background:var(--input-bg, #2a2a2a); color:var(--text-primary, #e0e0e0); border-color:var(--border-color, #444); }

/* ========================================
   スタッフ別詳細モーダル
   ======================================== */
.staff-detail-modal {
    display:none;
    position:fixed;
    inset:0;
    z-index:9999;
    background:var(--bg-primary, #0f172a);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}
.staff-detail-modal.active { display:block; }
.staff-detail-modal-inner { max-width:900px; margin:0 auto; padding:16px; }
.staff-detail-modal-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid var(--border-color, #334155);
    margin-bottom:16px;
}
.staff-detail-modal-header h2 { margin:0; font-size:18px; color:var(--text-primary, #e2e8f0); }
.staff-detail-close-btn {
    background:none;
    border:none;
    color:var(--text-secondary, #94a3b8);
    font-size:22px;
    cursor:pointer;
    padding:4px 8px;
    border-radius:8px;
    transition:all 0.2s;
}
.staff-detail-close-btn:hover { background:var(--hover-bg, #1e293b); color:#ef4444; }

.staff-detail-header-info {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}

/* カードグリッド */
.staff-card-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
    gap:12px;
}
.staff-card {
    background:var(--card-bg, #1e293b);
    border:1px solid var(--border-color, #334155);
    border-radius:12px;
    padding:16px;
    cursor:pointer;
    transition:all 0.2s;
    position:relative;
    overflow:hidden;
}
.staff-card:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.3); border-color:var(--accent-color, #3b82f6); }
.staff-card:active { transform:translateY(0); }
.staff-card-store {
    display:inline-block;
    font-size:10px;
    font-weight:700;
    color:#fff;
    padding:2px 8px;
    border-radius:4px;
    margin-bottom:8px;
    letter-spacing:0.5px;
}
.staff-card-name {
    font-size:16px;
    font-weight:700;
    color:var(--text-primary, #e2e8f0);
    margin-bottom:12px;
}
.staff-card-stats { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.staff-card-stat { display:flex; flex-direction:column; }
.staff-card-stat-label { font-size:10px; color:var(--text-secondary, #94a3b8); }
.staff-card-stat-value { font-size:13px; font-weight:600; color:var(--text-primary, #e2e8f0); }
.staff-card-avg {
    margin-top:10px;
    padding-top:8px;
    border-top:1px solid var(--border-color, #334155);
    font-size:11px;
    color:var(--text-secondary, #94a3b8);
}

/* 日別詳細ヘッダー */
.staff-daily-header { margin-bottom:16px; }
.staff-back-btn {
    background:var(--card-bg, #1e293b);
    border:1px solid var(--border-color, #334155);
    color:var(--text-primary, #e2e8f0);
    padding:8px 16px;
    border-radius:8px;
    cursor:pointer;
    font-size:14px;
    margin-bottom:12px;
    display:inline-block;
    transition:all 0.2s;
}
.staff-back-btn:hover { background:var(--hover-bg, #334155); }
.staff-daily-title { display:flex; align-items:center; gap:10px; margin-top:8px; }
.staff-daily-store-badge {
    display:inline-block;
    font-size:11px;
    font-weight:700;
    color:#fff;
    padding:3px 10px;
    border-radius:4px;
}
.staff-daily-name { font-size:20px; font-weight:700; color:var(--text-primary, #e2e8f0); }
.staff-daily-month { font-size:14px; color:var(--text-secondary, #94a3b8); }

/* サマリーカード */
.staff-summary-cards {
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));
    gap:8px;
    margin-bottom:16px;
}
.staff-summary-card {
    background:var(--card-bg, #1e293b);
    border:1px solid var(--border-color, #334155);
    border-radius:8px;
    padding:10px 12px;
    text-align:center;
}
.staff-summary-label { font-size:10px; color:var(--text-secondary, #94a3b8); margin-bottom:4px; }
.staff-summary-value { font-size:15px; font-weight:700; color:var(--text-primary, #e2e8f0); }

/* 日別テーブル */
.staff-daily-table-wrapper { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.staff-daily-table {
    width:100%;
    border-collapse:collapse;
    font-size:12px;
}
.staff-daily-table th {
    background:var(--card-bg, #1e293b);
    color:var(--text-secondary, #94a3b8);
    font-weight:600;
    font-size:10px;
    text-transform:uppercase;
    padding:8px 6px;
    border-bottom:2px solid var(--border-color, #334155);
    white-space:nowrap;
    position:sticky;
    top:0;
    z-index:10;
}
.staff-daily-table td {
    padding:8px 6px;
    border-bottom:1px solid var(--border-color, #1e293b);
    color:var(--text-primary, #e2e8f0);
    white-space:nowrap;
}
.staff-daily-table tbody tr:hover { background:var(--hover-bg, #1e293b80); }
.staff-daily-total-row {
    background:var(--card-bg, #1e293b) !important;
    border-top:2px solid var(--border-color, #334155);
}
.staff-daily-total-row td { padding:10px 6px; }

/* ライトモード */
[data-theme="light"] .staff-detail-modal { background:#f8fafc; }
[data-theme="light"] .staff-card { background:#fff; border-color:#e2e8f0; }
[data-theme="light"] .staff-card:hover { border-color:#3b82f6; box-shadow:0 4px 12px rgba(0,0,0,0.08); }
[data-theme="light"] .staff-card-name { color:#1e293b; }
[data-theme="light"] .staff-card-stat-value { color:#1e293b; }
[data-theme="light"] .staff-back-btn { background:#fff; border-color:#e2e8f0; color:#1e293b; }
[data-theme="light"] .staff-summary-card { background:#fff; border-color:#e2e8f0; }
[data-theme="light"] .staff-summary-value { color:#1e293b; }
[data-theme="light"] .staff-daily-table th { background:#f1f5f9; color:#64748b; }
[data-theme="light"] .staff-daily-table td { color:#1e293b; border-color:#e2e8f0; }
[data-theme="light"] .staff-daily-total-row { background:#f1f5f9 !important; }
[data-theme="light"] .staff-detail-modal-header { border-color:#e2e8f0; }
[data-theme="light"] .staff-detail-modal-header h2 { color:#1e293b; }

/* スマホ対応 */
@media (max-width:640px) {
    .staff-card-grid { grid-template-columns:repeat(2, 1fr); gap:8px; }
    .staff-card { padding:12px; }
    .staff-card-name { font-size:14px; }
    .staff-summary-cards { grid-template-columns:repeat(2, 1fr); }
    .staff-daily-table { font-size:11px; }
    .staff-daily-table th, .staff-daily-table td { padding:6px 4px; }
}
@media (max-width: 768px) { .chart-grid { grid-template-columns: 1fr !important; } }

/* ライトテーマ: チャートカード */
[data-theme="light"] .chart-box {
    background: #ffffff !important;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
[data-theme="light"] .chart-box h4 {
    color: #1e293b !important;
}

/* Floating header for shift calendar */
.shift-cal-floating-header{background:var(--card-bg,#fff);border-bottom:2px solid var(--accent,#6c5ce7);box-shadow:0 2px 8px rgba(0,0,0,0.15)}
.shift-cal-floating-header table{margin:0}
.shift-cal-floating-header th{background:var(--card-bg,#fff)!important;font-size:11px;white-space:nowrap;padding:4px 6px;border:1px solid var(--border-color,#ddd);text-align:center;min-width:50px}
.shift-cal-floating-header .staff-name-cell{text-align:left;font-weight:600;min-width:80px}
.shift-cal-floating-header .sun{color:#ef4444}
.shift-cal-floating-header .sat{color:#3b82f6}
[data-theme="dark"] .shift-cal-floating-header{background:#1a1a2e;border-bottom-color:#6c5ce7}
[data-theme="dark"] .shift-cal-floating-header th{background:#1a1a2e!important;border-color:#333}