@charset "utf-8";
/* CSS Document */
* {padding: 0;margin: 0;}
a {text-decoration: none;}
ol,ul li {list-style-type: none;}
em,i,address {font-style: normal;}
b,strong,th {font-weight: normal;}
img,input {border: 0;max-width: 100%;}
input,img,textarea,button {vertical-align: middle;border: 0;font-family: 'Microsoft YaHei';}
input[type='button'],input[type='submit'],input[type='reset'],select {-webkit-appearance: none;}
input:focus {outline: none;}
.fl {float: left;}
.fr {float: right;}
.clear {clear: both;height: 0;overflow: hidden;}
.clearfix:after {content: '';height: 0;display: block;clear: both;visibility: hidden;}
html,body {width: 100%;height: 100%;font-family: 'Microsoft YaHei';font-size: 14px;background: #ffffff;}

/* main */
.layui-container{width: 95%; max-width: 1440px;}
.homemain h1 {font-size: 32px; font-weight: bold;}

/* 省份选中样式 */
#provinceTab .layui-btn.layui-this {border-color: #2a9d8f;color: #2a9d8f;background: none;font-weight: 600;}

/* 隐藏未选中的组 */
#cityList .test-item,#countyList .test-item {display: none;}
#cityList .test-item.layui-show,#countyList .test-item.layui-show {display: block;}

/* 自定义样式优化 */
.homemain .banner {text-align: center;padding: 20px 0;}
.banner-btn{position: absolute; top: 30px; right: 0;}
.banner-btn button{width: 100px;}
.door-point .layui-panel {height: auto !important;/*min-height: 180px;*/}
.door-point .panel-l {border-right: 0;}
.door-point .layui-btn-container .layui-btn {margin-bottom: 0 !important;height: 60px;}
.door-point ul {display: flex;flex-wrap: wrap;margin: 0;padding: 0;}
.door-point ul li {margin: 9px;list-style: none;}
.province {height: 60px;display: flex;justify-content: space-between;gap: 10px;}
.province button {flex: 1;font-size: 18px;}
.city {padding: 10px 0;border-bottom: #eee 1px solid;margin-bottom: 10px;}
.county {padding: 10px 0;}
.county .layui-btn-xs{ padding: 0px 10px; height: 25px; border:none;}

/* 关键：城市、区县、远途门点选中样式（统一深绿色） */
#cityList .layui-btn.layui-this,#countyList .layui-btn.layui-this,#longDistancePoints .layui-btn.layui-this {background-color: #2a9d8f !important;color: #fff !important;border-color: #2a9d8f !important;}

/* 远途门点区域优化 */
.province2 .layui-panel ul {display: flex;flex-wrap: wrap;}
.province2 .layui-panel li {margin: 6px 9px;}
.province2 h2 button {width: 100%;height: 60px;font-size: 18px;font-weight: normal;}

/* 港口区域样式 */
.port-point {margin-top: 20px;}
.dock-head{ display: flex;}
.dock-head button{flex: 1; justify-content: space-between; height: 42px;}


/* 港口Tab选中样式（与省份Tab一致） */
#portTab .layui-btn.layui-this {border-color: #2a9d8f;color: #2a9d8f;background: none;font-weight: 600;}


/* 港区/做箱地点文本样式 */
.dock-title {padding: 10px;background-color: #f8f9fa;border-radius: 4px; display: flex; justify-content: space-around;}
.dock-title p {color: #333;font-size: 14px;}
.dock-title span {color: #2a9d8f;font-weight: 600;}

/* 价格面板样式 */
.price {text-align: center;font-size: 16px;color: #333;}
.price .test-item {display: none;}
.price .layui-panel{margin-bottom: 10px;}
.price .layui-tabs-header{ display: flex;}
/* .price .layui-tabs-card{ background-color: rgba(242, 99, 72, .5);  } */
.price .layui-tabs-card>.layui-tabs-header{ /*background-color: rgba(242, 99, 72, .05);*/ background-color: #f8f8f8; }
.price .layui-tabs-card>.layui-tabs-header .layui-this{font-weight: bold;font-size: 16px; color: orangered;  }
.price .layui-tabs-card.layui-panel>.layui-tabs-body{  font-size: 14px; padding: 10px;display: flex; justify-content: space-between;}
.price .layui-tabs-card.layui-panel>.layui-tabs-body .layui-tabs-item{  width: 100%;}
.price .layui-tabs-body .layui-tabs-item strong{ color: orangered;}
.price .layui-tabs-body .layui-tabs-item i{ font-size: 16px; color: orangered;}
.price-item{display: flex; justify-content: space-between; align-items: center;}
.price-item p{width: 50px;}
.price-item p .layui-input{border:#e6e6e6 solid 1px; height: 30px; background-color: #f8f8f8;}

/* 自定义数字输入框样式 */
.num-input-group { display: inline-flex;  align-items: center; border: 1px solid #e6e6e6; border-radius: 2px; overflow: hidden;}
.num-input-btn { width: 30px; height: 30px; line-height: 30px; text-align: center; cursor: pointer; background-color: #f8f8f8; user-select: none;}
.num-input-btn:hover { background-color: #f2f2f2;}
.num-input { width: 40px; height: 30px; line-height: 30px; text-align: center; border: none; outline: none; }

/* 右侧完善信息 */
.port-right .layui-card-body{ padding: 0;}
.tips{box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);padding: 10px 15px;}
.remind{box-shadow: 1px 1px 4px rgb(0 0 0 / 8%);padding: 10px 15px; margin-top: 20px; background-color: #f2f2f2;}
/* .layui-form-item{ width: 100%;} */
.neworder .layui-form-label{  width: 120px!important; padding: 9px 4px;  display: flex; justify-content: flex-end; }
.neworder .layui-form-label span{ color: orangered; padding-right: 5px;}
.neworder .layui-form-label i{ position: absolute; right:-15px}
.neworder .layui-input-block{ margin-left: 150px!important; }
.neworder .layui-input-block span{position: relative; top: 5px; color: orange;}
.neworder .layui-textarea{min-height: auto;}
.neworder .layui-input-suffix{ display: flex; align-items: center; }
.neworder .layui-input-suffix .layui-icon{ padding-right: 5px;}
.neworder .use-address{width: 105px!important; color: #3abba9;}
.neworder .use-address .layui-icon{color: #3abba9;}
.neworder .insure{ display: flex; align-items: center;}
.neworder .insure p{ position: relative; top: 3px;}
.neworder .insure p span{ top: 0px; padding: 0 15px;}
.neworder .insure p a{/*padding: 0 15px;*/ display: inline-block;  text-transform: uppercase; color: orange;}
.Approved .layui-input-block{display: flex; align-items: center; }
.Approved .layui-input-block a{display: inline-block; text-transform: uppercase; color: #1e9fff; margin-top: 8px;}
/* 覆盖Layui radio选中后的圆点颜色 */
.layui-form-radio>i:hover, .neworder .layui-form-radioed>i { color: #3abba9 !important; }
.layui-form-radio:hover>*{color: orange !important;}
/* 可选：覆盖选中后的文字颜色（如果需要） */
.layui-form-radioed>span {  color: #3abba9 !important; }
.layui-form-radioed{color: #3abba9 !important;}
#goToAdmin{width: 300px;}
/* 开关开启状态的背景色 + 滑块颜色 */
.layui-form-onswitch {  border-color: #3abba9 !important; background-color: #3abba9 !important;}
/* 复选框选中的颜色 */
.layui-form-checked i, .layui-form-checked:hover i { background-color: #2a9d8f!important; color: #ffffff !important;
}
/* 开关滑块的阴影（可选，优化视觉） */
.layui-form-onswitch em { background-color: #fff; /* 滑块本身白色，和#3abba9搭配更明显 */}