/* ライトモード（デフォルト）のスタイル */
body {
    background-color: #fff;
    color: #666;
}

/* カードのスタイル - ライトモード */
.uk-card-default {
    background-color: #fff !important;
    color: #666 !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}

.uk-card-title {
    color: #333 !important;
    font-weight: 600;
}

.uk-card-default .uk-card-header {
    border-bottom: 1px solid #e5e5e5;
    background-color: #fff !important;
    color: #666 !important;
}

/* カードヘッダーのバリエーション */
.uk-card-header.uk-background-muted {
    background-color: #f8f8f8 !important;
    color: #333 !important;
}

.uk-card-header.uk-background-primary {
    background-color: #1e87f0 !important;
    color: #fff !important;
}

.uk-card-header.uk-background-secondary {
    background-color: #222 !important;
    color: #fff !important;
}

.uk-card-default .uk-card-footer {
    border-top: 1px solid #e5e5e5;
    background-color: #fff !important;
}

.uk-card-default.uk-card-hover:hover {
    background-color: #f8f8f8 !important;
    box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}

/* 売上合計金額表示 */
.sales-total {
    font-size: 2.5rem;
    color: #333;
}

/* カードリンクのホバー効果 */
a.uk-link-reset .uk-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

a.uk-link-reset:hover .uk-card {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

body.uk-dark a.uk-link-reset:hover .uk-card {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5);
}

body.uk-dark .sales-total {
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* ライトモード時のナビゲーション */
.uk-navbar-container:not(.uk-navbar-transparent) {
    background: #f8f8f8 !important;
    border-bottom: 1px solid #eee;
}

.uk-navbar-nav>li>a {
    color: #333 !important;
    font-weight: 500;
}

.uk-navbar-nav>li:hover>a,
.uk-navbar-nav>li>a:focus,
.uk-navbar-nav>li>a.uk-open {
    color: #1e87f0 !important;
    transition: color 0.1s ease-in-out;
}

/* ハンバーガーメニューアイコン - ライトモード */
.uk-navbar-toggle {
    color: #333 !important;
}

.uk-navbar-toggle:hover,
.uk-navbar-toggle:focus {
    color: #1e87f0 !important;
}

/* ライトモード時のボタン */
.uk-button-default {
    background-color: #fff;
    color: #333;
    border: 1px solid #e5e5e5;
}

.uk-button-default:hover {
    background-color: #f8f8f8;
    color: #333;
    border-color: #d5d5d5;
}

/* オフキャンバスメニューのスタイル */
.uk-offcanvas-bar .uk-nav-default>li>a {
    font-size: 1.2rem;
    padding: 12px 0;
}

.uk-offcanvas-bar .uk-nav-header {
    padding: 12px 0;
    font-weight: bold;
}

.uk-container {
    padding-left: 0;
    padding-right: 0;
}

.uk-card-body {
    padding-left: 10px;
    padding-right: 10px;
}

@media (min-width: 768px) {
    .uk-container {
        padding-left: 3vh;
        padding-right: 30px;
    }

    .uk-card-body {
        padding-left: 30px;
        padding-right: 30px;
    }
}
/* 利益金額の色を調整 - ダークモードでも見やすい明るい緑色に */
.profit-amount,
.text-success,
.text-profit {
    color: #4ade80 !important; /* より明るい緑色 */
}

/* ページネーションスタイル */
.uk-pagination > li > a,
.uk-pagination > li > span {
    padding: 5px 10px;
    color: #333;
    border-radius: 3px;
}

.uk-pagination > li.active > a {
    background-color: #1e87f0;
    color: #fff;
}

.uk-pagination > li > a:hover {
    background-color: #f8f8f8;
    color: #1e87f0;
    text-decoration: none;
}

/* 説明リストのスタイル */
.uk-description-list dt {
    font-weight: 600;
    color: #333;
}

/* UIkitラベルのカスタムスタイル */
.uk-label {
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: none;
}

.uk-label-success {
    background-color: #32d296 !important;
    color: #fff !important;
}

.uk-label-warning {
    background-color: #faa05a !important;
    color: #fff !important;
}

.uk-label-default {
    background-color: #8e8e8e !important;
    color: #fff !important;
}

/* テーブルのスタイル - ライトモード */
.uk-table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.uk-table-striped tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

/* テーブルのテキストカラー */
.uk-table th {
    color: #333 !important;
}

.uk-table td {
    /* color: #666 !important; */
}

/* カレンダー表示のスタイル修正 */
.uk-table-calendar {
    background-color: #fff !important;
    color: #333 !important;
}

.uk-table-calendar th,
.uk-table-calendar td {
    background-color: #fff !important;
    color: #333 !important;
    border-color: #e5e5e5 !important;
}

.uk-table-calendar th {
    background-color: #f8f8f8 !important;
    font-weight: bold;
}

/* 土日の色 */
.uk-table-calendar .uk-text-danger {
    color: #f0506e !important;
}

.uk-table-calendar .uk-text-primary {
    color: #1e87f0 !important;
}

/* 売上金額セル */
.uk-table-calendar .sales-cell {
    background-color: #f8f8f8 !important;
    color: #333 !important;
}

/* 月カレンダー表示の修正 */
.uk-table-calendar.month-calendar,
.uk-table-calendar.month-calendar th,
.uk-table-calendar.month-calendar td {
    background-color: #fff !important;
    color: #333 !important;
}

        /* カスタムスタイル */
        .uk-navbar-container:not(.uk-navbar-transparent) {
            background: #f8f8f8;
        }

        .uk-navbar-nav>li>a {
            color: #333;
        }

        .uk-navbar-nav>li:hover>a {
            color: #1e87f0;
        }

        /* テーブルスタイル */
        .uk-table th {
            background-color: #f8f8f8;
        }

        /* カード内のテーブル */
        .uk-card .uk-table {
            margin-bottom: 0;
        }

        /* 売上金額表示 */
        .sales-total {
            font-size: 2.5rem;
            color: #333;
            font-weight: bold;
        }

        /* 利益金額の色 */
        .profit-amount {
            color: #32d296 !important;
            font-weight: bold;
        }

/* パンくずリストのスタイル */
.uk-breadcrumb {
    padding: 10px 0;
    margin-bottom: 15px;
}

.uk-breadcrumb > ul {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.uk-breadcrumb > ul > li {
    display: flex;
    align-items: center;
}

.uk-breadcrumb > ul > li:not(:last-child)::after {
    content: "/";
    margin: 0 8px;
    color: #999;
    font-size: 0.9rem;
}

.uk-breadcrumb a {
    color: #1e87f0;
    text-decoration: none;
    transition: color 0.2s ease;
}

.uk-breadcrumb a:hover {
    color: #0f6ecd;
    text-decoration: underline;
}

.uk-breadcrumb > ul > li:last-child > span {
    color: #666;
    font-weight: 500;
}