/* ============ 自驾AA 手机风格样式 ============ */

:root {
    --aa-green: #10b981;
    --aa-green-dark: #0d9f6e;
    --aa-bg: #f4f6f8;
    --aa-text: #1f2937;
    --aa-muted: #8a919c;
    --aa-danger: #dc2626;
    --aa-warn: #d97706;
}

body {
    background: var(--aa-bg);
    color: var(--aa-text);
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
}

/* ---- 应用外壳：内容居中、留出底部导航空间 ---- */
.app-content {
    max-width: 520px;
    margin: 0 auto;
    padding: 12px 12px 84px 12px;
}

/* ---- 顶部导航条 ---- */
.app-navbar {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    border-bottom: 1px solid #eceef1;
}
.app-navbar-inner {
    max-width: 520px;
    margin: 0 auto;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.app-brand {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--aa-green-dark);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
}
.app-navbar-right a {
    color: var(--aa-muted);
    text-decoration: none;
    font-size: 0.9rem;
}

/* ---- 底部标签导航 ---- */
.app-tabbar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #fff;
    border-top: 1px solid #eceef1;
}
.app-tabbar-inner {
    max-width: 520px;
    margin: 0 auto;
    display: flex;
}
.app-tabbar a {
    flex: 1;
    text-align: center;
    padding: 6px 0 8px 0;
    color: var(--aa-muted);
    text-decoration: none;
    font-size: 0.72rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}
.app-tabbar a i {
    font-size: 1.3rem;
}
.app-tabbar a.active {
    color: var(--aa-green-dark);
    font-weight: 600;
}

/* ---- 卡片 ---- */
.card {
    border: none;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.06);
}

/* ---- 金额 ---- */
.money {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.money-plus { color: var(--aa-danger); }
.money-minus { color: var(--aa-green-dark); }

/* ---- 费用列表项 ---- */
.expense-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f2f4;
    text-decoration: none;
    color: inherit;
}
.expense-item:last-child { border-bottom: none; }
.expense-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
    color: #fff;
}
.cat-MEAL   { background: #f59e0b; }
.cat-LODGING{ background: #3b82f6; }
.cat-TICKET { background: #8b5cf6; }
.cat-FUEL   { background: #ef4444; }
.cat-TOLL   { background: #14b8a6; }
.cat-CUSTOM { background: #6b7280; }

/* ---- 徽标 ---- */
.badge-soft-green { background: #d1fae5; color: #065f46; }
.badge-soft-gray  { background: #eef0f3; color: #4b5563; }
.badge-soft-orange{ background: #fef3c7; color: #92400e; }
.badge-soft-red   { background: #fee2e2; color: #991b1b; }
.badge-soft-blue  { background: #dbeafe; color: #1e40af; }

/* ---- 头像 ---- */
.avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--aa-green);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    flex-shrink: 0;
}
.avatar-sm { width: 30px; height: 30px; font-size: 0.85rem; }

/* ---- 统计条 ---- */
.stat-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 0.85rem; }
.stat-bar-row .label { width: 56px; color: var(--aa-muted); flex-shrink: 0; }
.stat-bar-row .amount { width: 64px; text-align: right; flex-shrink: 0; }

/* ---- 登录页 ---- */
.auth-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: linear-gradient(160deg, #10b981 0%, #059669 60%, #047857 100%);
}
.auth-card {
    width: 100%;
    max-width: 400px;
    background: #fff;
    border-radius: 18px;
    padding: 28px 24px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}
.auth-logo {
    text-align: center;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--aa-green-dark);
    margin-bottom: 4px;
}
.auth-sub { text-align: center; color: var(--aa-muted); margin-bottom: 22px; font-size: 0.9rem; }

/* ---- 其它 ---- */
.section-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--aa-muted);
    margin: 18px 0 8px 0;
}
.text-muted-2 { color: var(--aa-muted); font-size: 0.85rem; }
.divider { height: 1px; background: #eceef1; margin: 14px 0; }
.thumb {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
}
.empty-tip { text-align: center; color: var(--aa-muted); padding: 40px 0; }
.empty-tip i { font-size: 2.6rem; display: block; margin-bottom: 10px; }

/* 表单控件圆角统一 */
.form-control, .form-select, .btn {
    border-radius: 10px;
}
.btn-primary {
    background: var(--aa-green);
    border-color: var(--aa-green);
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--aa-green-dark);
    border-color: var(--aa-green-dark);
}
.btn-outline-primary {
    color: var(--aa-green-dark);
    border-color: var(--aa-green-dark);
}
.btn-outline-primary:hover {
    background: var(--aa-green-dark);
    border-color: var(--aa-green-dark);
}

/* 打印：只打印结算单内容 */
@media print {
    .app-navbar, .app-tabbar, .no-print { display: none !important; }
    .app-content { padding: 0; max-width: none; }
}