.wallet-card, .goal-card, .debt-card {
    background: var(--color-card);
    padding: 12px;
    border-radius: var(--radius-md);
    margin-bottom: 10px;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}
.wallet-card-header { display: flex; justify-content: space-between; align-items: center; }
.wallet-logo-img, .menu-icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
}
.wallet-name, .debt-name, .goal-title { margin: 0; font-size: 14px; font-weight: bold; color: var(--color-text); }
.wallet-balance, .debt-amount { margin: 4px 0 0 0; font-size: 13px; font-weight: 600; color: var(--color-text); }
.debt-type-label { font-size: 10px; font-weight: bold; margin-bottom: 4px; }

#wadah-dompet {
    max-height: 320px;
    overflow-y: auto;
    padding-right: 6px;
}
#wadah-dompet::-webkit-scrollbar { width: 4px; }
#wadah-dompet::-webkit-scrollbar-track { background: transparent; }
#wadah-dompet::-webkit-scrollbar-thumb { background-color: var(--color-border); border-radius: 10px; }

.logo-preview-img { width: 50px; height: 50px; object-fit: cover; border-radius: 50%; }
.paylater-due-container { background: rgba(231, 76, 60, 0.1); border: 1px dashed var(--color-danger); border-radius: 8px; }
.input-amount-large { font-size: 24px; font-weight: bold; color: var(--color-primary); }
.sheet-tall { max-height: 95vh; }

.budget-card {
    padding: 10px 12px;
    margin-bottom: 8px;
    background: var(--color-card);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    border-left-width: 4px;
    border-left-style: solid;
}
.wallet-icon-placeholder {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0,0,0,0.05);
    color: var(--color-text);
}
.gap-10 { gap: 10px; }
.goal-card-main {
    background: var(--color-card);
    padding: 15px;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    margin-bottom: 12px;
}
.goal-home-card { border-left: 4px solid var(--color-pink); }
.border-dashed-bottom { border-bottom: 1px dashed var(--color-border); }
.paylater-bg { background: rgba(231, 76, 60, 0.03); border-left-color: var(--color-pink); }
.border-left-pink { border-left: 4px solid var(--color-pink); }
.border-left-success { border-left: 4px solid var(--color-success); }
.border-left-info { border-left: 4px solid var(--color-info); }

.paylater-detail-box {
    background: var(--color-bg);
    padding: 12px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    width: 100%;
    box-sizing: border-box;
    margin-top: 15px;
}
.paylater-detail-title {
    font-size: 11px;
    font-weight: bold;
    color: var(--color-text-muted);
    border-bottom: 1px dashed var(--color-border);
    padding-bottom: 8px;
    margin: 0 0 8px 0;
}
.paylater-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--color-border);
    width: 100%;
}
.paylater-item:last-child { border-bottom: none; padding-bottom: 0; }
.paylater-item-left { flex: 1; min-width: 0; }
.paylater-item-desc {
    font-size: 11px;
    font-weight: bold;
    display: block;
    word-break: break-word;
    overflow-wrap: break-word;
    color: var(--color-text);
    line-height: 1.3;
}
.paylater-item-cat { font-size: 10px; color: var(--color-text-muted); display: block; margin-top: 3px; }
.paylater-item-amount { font-size: 11px; font-weight: bold; white-space: nowrap; text-align: right; }

.split-trx-container { background: rgba(52, 152, 219, 0.05); border: 1px dashed var(--color-info); border-radius: 8px; }
.split-ui-container { border-color: rgba(52, 152, 219, 0.3); }
body.offline-mode { border-top: 6px solid var(--color-danger); }
body.offline-mode button[type="submit"] { opacity: 0.5; cursor: not-allowed; }
.beta-banner {
    background: #e74c3c;
    color: white;
    text-align: center;
    padding: 6px;
    font-size: 11px;
    font-weight: bold;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}