/* ============================================================
   收货地址管理页样式（address.html）
   设计基调：政务服务扁平风，与 plate-binding.css / user.css 保持一致
   布局：移动端纵向单列 + 地址编辑底部抽屉；PC 端双列卡片 + 居中弹窗
   ============================================================ */
.addr-wrap { max-width: 860px; margin: 0 auto; padding: 24px 16px 60px; min-height: 70vh; }
.addr-card {
    background: var(--c-surface);
    border-radius: 12px;
    border: 1px solid var(--c-border);
    overflow: hidden;
}

/* ---------- 页头 ---------- */
.addr-head-card { margin-bottom: 16px; }
.addr-header {
    padding: 20px 24px;
    background: linear-gradient(180deg, var(--c-primary-light), var(--c-surface));
    display: flex;
    align-items: center;
    gap: 14px;
}
.addr-header-icon {
    width: 44px; height: 44px;
    border-radius: 8px;
    background: var(--c-primary);
    color: var(--c-white);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}
.addr-header-meta { flex: 1; min-width: 0; }
.addr-header h1 { font-size: 20px; font-weight: 700; color: var(--c-text); margin: 0; }
.addr-header p { font-size: 13px; color: var(--c-text-3); margin: 4px 0 0; }
.addr-header p b { color: var(--c-primary); }
.addr-add-btn {
    flex-shrink: 0;
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    background: var(--c-primary);
    color: var(--c-white);
    font-size: 14px; font-weight: 600;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: 6px;
    transition: background .2s, transform .2s;
}
.addr-add-btn:hover { background: var(--c-primary-dark); transform: translateY(-1px); }

/* ---------- 返回来源页引导条（从确认订单页 ?from= 进入时显示） ---------- */
.addr-back-bar {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
    padding: 12px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(24, 144, 255, .35);
    border-radius: 12px;
    background: linear-gradient(180deg, var(--c-primary-light), var(--c-surface));
    cursor: pointer;
    box-sizing: border-box;
    transition: border-color .2s, box-shadow .2s, transform .2s;
}
.addr-back-bar:hover { border-color: var(--c-primary); box-shadow: 0 4px 14px rgba(24, 144, 255, .12); transform: translateY(-1px); }
.addr-back-icon {
    width: 38px; height: 38px;
    border-radius: 8px;
    background: var(--c-primary);
    color: var(--c-white);
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.addr-back-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.addr-back-text b { font-size: 14px; font-weight: 700; color: var(--c-text); }
.addr-back-text i { font-style: normal; font-size: 12px; color: var(--c-text-3); margin-top: 2px; }
.addr-back-go { color: var(--c-text-3); font-size: 13px; flex-shrink: 0; }

/* ---------- 地址列表 ---------- */
.addr-list { display: grid; grid-template-columns: 1fr; gap: 12px; }
.addr-loading, .addr-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 20px;
    color: var(--c-text-3);
    background: var(--c-surface);
    border: 1px dashed var(--c-border);
    border-radius: 12px;
}
.addr-loading i, .addr-empty i { font-size: 36px; margin-bottom: 12px; opacity: .5; }
.addr-empty p { margin: 0; font-size: 14px; }

/* 地址卡片 */
.addr-item {
    position: relative;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: 12px;
    padding: 16px 18px 12px;
    transition: border-color .2s, box-shadow .2s;
}
.addr-item:hover { border-color: var(--c-primary); box-shadow: 0 4px 14px rgba(24, 144, 255, .10); }
.addr-item.is-default { border-color: var(--c-primary); }

.addr-item-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.addr-item-name { font-size: 16px; font-weight: 700; color: var(--c-text); }
.addr-item-phone { font-size: 14px; color: var(--c-text-2); }
.addr-default-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: var(--c-primary);
    color: var(--c-white);
    font-size: 11px; font-weight: 600;
    line-height: 1.5;
}
.addr-item-addr {
    margin-top: 8px;
    font-size: 14px;
    color: var(--c-text-2);
    line-height: 1.6;
    word-break: break-all;
}

/* 卡片操作行 */
.addr-item-ops {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--c-border);
}
.addr-op {
    padding: 6px 10px;
    border: none;
    background: transparent;
    color: var(--c-text-3);
    font-size: 13px;
    cursor: pointer;
    border-radius: 6px;
    display: inline-flex; align-items: center; gap: 5px;
    transition: color .2s, background .2s;
}
.addr-op:hover { background: var(--c-bg-2); color: var(--c-text); }
.addr-op.addr-op-default:hover { color: var(--c-primary); }
.addr-op.addr-op-del:hover { color: #e74c3c; }
.addr-op-spacer { flex: 1; }
.addr-op.is-on { color: var(--c-primary); font-weight: 600; }

/* ---------- 新增/编辑弹窗 ---------- */
.addr-mask {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 200;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: addrFadeIn .2s ease;
}
@keyframes addrFadeIn { from { opacity: 0; } to { opacity: 1; } }

.addr-sheet {
    width: 100%;
    max-width: 560px;
    background: var(--c-surface);
    border-radius: 16px 16px 0 0;
    display: flex;
    flex-direction: column;
    max-height: 92vh;
    animation: addrSlideUp .25s ease;
    /* 移动端底部安全区适配 */
    padding-bottom: env(safe-area-inset-bottom);
}
@keyframes addrSlideUp { from { transform: translateY(40px); opacity: .6; } to { transform: translateY(0); opacity: 1; } }

.addr-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--c-border);
}
.addr-sheet-head h2 { font-size: 17px; font-weight: 700; color: var(--c-text); margin: 0; }
.addr-sheet-close {
    width: 32px; height: 32px;
    border: none;
    background: var(--c-bg-2);
    color: var(--c-text-3);
    font-size: 18px;
    border-radius: 50%;
    cursor: pointer;
    line-height: 1;
    transition: background .2s, color .2s;
}
.addr-sheet-close:hover { background: var(--c-border); color: var(--c-text); }

.addr-sheet-body { padding: 16px 20px; overflow-y: auto; flex: 1; }

.addr-form-row { display: flex; gap: 12px; }
.addr-form-2col .addr-form-group { flex: 1; min-width: 0; }
.addr-form-group { margin-bottom: 14px; }
.addr-label { display: block; font-size: 14px; font-weight: 600; color: var(--c-text); margin-bottom: 8px; }
.addr-req { color: #e74c3c; margin-left: 2px; }

.addr-input {
    width: 100%;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    font-size: 15px; color: var(--c-text);
    outline: none;
    box-sizing: border-box;
    transition: border-color .2s, box-shadow .2s;
}
.addr-input:focus { border-color: var(--c-primary); box-shadow: 0 0 0 2px rgba(24, 144, 255, .15); }
.addr-input::placeholder { color: var(--c-text-3); }
.addr-input.addr-err { border-color: #e74c3c; }
.addr-textarea { resize: vertical; min-height: 64px; font-family: inherit; }

/* 省市区三级联动 */
.addr-region { display: flex; gap: 10px; }
.addr-select {
    flex: 1;
    min-width: 0;
    padding: 12px 10px;
    border-radius: 8px;
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    font-size: 14px; color: var(--c-text);
    outline: none;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
}
.addr-select:focus { border-color: var(--c-primary); box-shadow: 0 0 0 2px rgba(24, 144, 255, .15); }
.addr-select:disabled { opacity: .55; cursor: not-allowed; }
.addr-select.addr-err { border-color: #e74c3c; }

/* 默认地址开关 */
.addr-default-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    padding: 4px 0 2px;
}
.addr-default-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.addr-switch {
    position: relative;
    width: 44px; height: 24px;
    border-radius: 12px;
    background: var(--c-border);
    transition: background .2s;
    flex-shrink: 0;
}
.addr-switch::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--c-white);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    transition: transform .2s;
}
.addr-default-toggle input:checked + .addr-switch { background: var(--c-primary); }
.addr-default-toggle input:checked + .addr-switch::after { transform: translateX(20px); }
.addr-default-text { font-size: 14px; color: var(--c-text-2); }

.addr-sheet-foot {
    display: flex;
    gap: 12px;
    padding: 12px 20px 16px;
    border-top: 1px solid var(--c-border);
}
.addr-btn {
    flex: 1;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 15px; font-weight: 600;
    cursor: pointer;
    border: none;
    transition: background .2s, opacity .2s;
}
.addr-btn-primary { background: var(--c-primary); color: var(--c-white); }
.addr-btn-primary:hover { background: var(--c-primary-dark); }
.addr-btn-primary:disabled { opacity: .6; cursor: not-allowed; }
.addr-btn-ghost { background: var(--c-bg-2); color: var(--c-text-2); border: 1px solid var(--c-border); }
.addr-btn-ghost:hover { border-color: var(--c-primary); color: var(--c-primary); }

/* ---------- PC 端（≥769px） ---------- */
@media (min-width: 769px) {
    .addr-list { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .addr-mask { align-items: center; padding: 24px; }
    .addr-sheet {
        border-radius: 16px;
        max-height: 86vh;
        animation: addrZoomIn .22s ease;
        padding-bottom: 0;
    }
    @keyframes addrZoomIn { from { transform: scale(.95) translateY(10px); opacity: 0; } to { transform: scale(1) translateY(0); opacity: 1; } }
}

/* ---------- 移动端细节（≤480px） ---------- */
@media (max-width: 480px) {
    .addr-wrap { padding: 16px 12px 48px; }
    .addr-header { padding: 16px; flex-wrap: wrap; }
    .addr-header h1 { font-size: 18px; }
    .addr-add-btn { width: 100%; justify-content: center; margin-top: 4px; }
    .addr-form-row { flex-direction: column; gap: 0; }
    .addr-region { flex-direction: column; gap: 10px; }
    .addr-item { padding: 14px 14px 10px; }
}

/* ---------- 暗黑模式细节补偿 ---------- */
html[data-theme="dark"] .addr-item:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
html[data-theme="dark"] .addr-back-bar { border-color: rgba(24, 144, 255, .45); }
html[data-theme="dark"] .addr-back-bar:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
html[data-theme="dark"] .addr-mask { background: rgba(0, 0, 0, .65); }
html[data-theme="dark"] .addr-op.addr-op-del:hover { color: #ff7875; }
html[data-theme="dark"] .addr-req { color: #ff7875; }

/* 弹窗打开时锁定背景滚动（前台 common.css 未定义，局部补齐） */
body.modal-lock { overflow: hidden; }