/* ================= 统一搜索区域样式 ================= */
.search-wrapper {
    max-width: 700px;
    margin: 40px auto 30px auto;
}

/* 胶囊导航栏容器 */
.capsule-nav {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px;
}

/* 胶囊按钮基础样式 */
.capsule-btn {
    display: inline-block;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    color: #4b5563; /* 默认灰色 */
    background-color: #e5e7eb;
    text-decoration: none;
    border-radius: 9999px; /* 完美圆角胶囊 */
    transition: all 0.2s ease-in-out;
    border: 1px solid transparent;
}

/* 鼠标悬停 */
.capsule-btn:hover {
    background-color: #d1d5db;
    color: #1f2937;
}

/* 激活状态高亮（不同页面设置不同的 active 类名） */
.capsule-btn.active {
    color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* 三个通道各自激活时的品牌主题色（进口商-蓝，供应商-绿，提单-深蓝） */
.capsule-btn.active.importer-theme { background-color: #2563eb; border-color: #2563eb; }
.capsule-btn.active.exporter-theme { background-color: #059669; border-color: #059669; }
.capsule-btn.active.bol-theme      { background-color: #1e3a8a; border-color: #1e3a8a; }

/* 统一搜索框组合 */
.search-form-group {
    display: flex;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid #cbd5e1;
    background: #fff;
    transition: border-color 0.2s;
}
.search-form-group:focus-within {
    border-color: #3b82f6; /* 聚焦时变蓝 */
}

/* 统一输入框 */
.unified-input {
    flex: 1;
    border: none;
    padding: 14px 18px;
    font-size: 15px;
    outline: none;
    color: #1e293b;
    width: 100%;
}
/* 提单号自动转大写美化 */
.bol-input-upper {
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* 统一提交按钮 */
.unified-btn {
    border: none;
    padding: 0 28px;
    font-size: 15px;
    font-weight: bold;
    color: white;
    cursor: pointer;
    transition: background 0.2s;
}
/* 对应三大通道主题色的按钮背景 */
.btn-importer { background-color: #2563eb; }
.btn-importer:hover { background-color: #1d4ed8; }

.btn-exporter { background-color: #059669; }
.btn-exporter:hover { background-color: #047857; }

.btn-bol { background-color: #1e3a8a; }
.btn-bol:hover { background-color: #1d4ed8; }