animal-island-ui/src/components/Card/card.module.less

// ============================================
// Card — Animal Island Style
// ============================================

.card {
    border-radius: 20px;
    background: rgb(247, 243, 223);
    padding: 16px 24px;
    color: #725d42;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;

    &:hover {
        transform: translateY(-2px);
    }
}

// ---------- Type: title ----------
.card-title {
    background: #fdfdf5;
    border-radius: 40px 35px 45px 38px / 38px 45px 35px 40px;
    padding: 12px 32px;
    font-weight: 600;
}

// ---------- Type: dashed ----------
.card-dashed {
    background: rgb(250, 248, 242);
    border: 2px dashed #e8dcc8;
    box-shadow: none;

    &:hover {
        transform: none;
        border-color: #d4c4a8;
    }
}

// ============================================
// Color variants — NookPhone palette
// ============================================

// App Pink — 应用粉
.card-app-pink {
    background: #f8a6b2;
    color: #fff;
}

// Purple — 紫色
.card-purple {
    background: #b77dee;
    color: #fff;
}

// App Blue — 应用蓝
.card-app-blue {
    background: #889df0;
    color: #fff;
}

// App Yellow — 应用黄
.card-app-yellow {
    background: #f7cd67;
    color: #725d42;
}

// App Orange — 应用橙
.card-app-orange {
    background: #e59266;
    color: #fff;
}

// App Teal — 应用青
.card-app-teal {
    background: #82d5bb;
    color: #fff;
}

// App Green — 应用绿
.card-app-green {
    background: #8ac68a;
    color: #fff;
}

// App Red — 应用红
.card-app-red {
    background: #fc736d;
    color: #fff;
}

// Lime Green — 青柠绿
.card-lime-green {
    background: #d1da49;
    color: #3d5a1a;
}

// Yellow-Green — 黄绿色
.card-yellow-green {
    background: #ecdf52;
    color: #725d42;
}

// Brown — 棕色
.card-brown {
    background: #9a835a;
    color: #fff;
}

// Warm Peach Pink — 暖桃粉
.card-warm-peach-pink {
    background: #e18c6f;
    color: #fff;
}