/* ============================================================
   qlyw.cn 内页强化皮肤 —— inner-v2
   version: 1.0   (2026-09-22)
   加载方式：由 工具页(tool/*.html) 与 详情页(details/*.html) 原 <style> 之后引入
            （后加载 → 天然覆盖各模板自有样式，无需改动原样式代码）
   作用域：.inner-page-wrapper 内页容器（工具页/详情页共用结构）
   原则：只做视觉层（配色/圆角/阴影/字号/间距/触控区），不改任何功能与 DOM
   ============================================================ */

/* ---------- ① 设计令牌（与全站 restyle-v2 同源） ---------- */
.inner-page-wrapper{
  --i-brand:#0e9e8e;
  --i-brand2:#2fc4ae;
  --i-grad:linear-gradient(135deg,#0e9e8e,#2fc4ae);
  --i-brand-light:#e3f7f4;
  --i-ink:#17222b;
  --i-ink2:#5b6b77;
  --i-ink3:#93a1ab;
  --i-line:#e8eef1;
  --i-soft:#f7fafb;
}

/* ---------- ② 卡片：统一 18px 圆角 + 轻阴影 ---------- */
.inner-page-wrapper .layui-card{
  border-radius:18px !important;
  border:1px solid var(--i-line) !important;
  box-shadow:0 2px 12px rgba(23,34,43,.05) !important;
  overflow:hidden;
  transition:box-shadow .2s ease;
}
.inner-page-wrapper .layui-card:hover{box-shadow:0 8px 24px rgba(22,186,170,.09) !important;}

/* 卡片头：去掉原渐变底，统一白底 + 细分割线 */
.inner-page-wrapper .layui-card-header{
  padding:15px 18px !important;
  background:#fff !important;
  border-bottom:1px solid var(--i-line) !important;
  color:var(--i-ink);
}

/* ---------- ③ 标题区：H1 左对齐 + 品牌竖条，H2 降为副标题 ---------- */
.inner-page-wrapper .layui-card-header.text-center{text-align:left !important;}
.inner-page-wrapper h1{
  display:block;
  margin:0 !important;
  padding-left:11px;
  border-left:3px solid var(--i-brand);
  font-size:23px !important;
  font-weight:800 !important;
  line-height:1.32 !important;
  letter-spacing:.2px;
  color:var(--i-ink) !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  -webkit-text-fill-color:var(--i-ink) !important;
}
.inner-page-wrapper h2{
  margin:6px 0 0 !important;
  padding-left:14px;
  font-size:13.5px !important;
  font-weight:400 !important;
  line-height:1.55 !important;
  color:var(--i-ink2) !important;
}
@media (min-width:768px){
  .inner-page-wrapper h1{font-size:28px !important;}
  .inner-page-wrapper h2{font-size:14px !important;}
}

/* ---------- ④ 查询区：输入框 + 渐变查询按钮 ---------- */
.inner-page-wrapper .layui-input-group{
  display:flex !important;
  align-items:stretch;
  gap:9px;
  max-width:none !important;
  text-align:left !important;
}
.inner-page-wrapper .layui-input-group>.layui-input{
  flex:1;min-width:0;
  height:50px;line-height:50px;
  padding:0 15px;
  font-size:16px;
  background:#fafcfc;
  border:1.5px solid var(--i-line) !important;
  border-radius:13px !important;
  box-shadow:none !important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.inner-page-wrapper .layui-input-group>.layui-input:focus{
  background:#fff;
  border-color:var(--i-brand2) !important;
  box-shadow:0 0 0 4px rgba(47,196,174,.13) !important;
}
/* 查询按钮（suffix 容器） */
.inner-page-wrapper .layui-input-group .layui-input-suffix{
  flex-shrink:0;
  display:flex;align-items:center;justify-content:center;gap:5px;
  height:50px;
  padding:0 22px !important;
  border:0 !important;
  border-radius:13px !important;
  background:var(--i-grad) !important;
  color:#fff !important;
  font-size:16px;font-weight:700;letter-spacing:1px;
  cursor:pointer;
  box-shadow:0 6px 16px rgba(14,158,142,.26);
  transition:transform .15s ease,box-shadow .15s ease;
}
.inner-page-wrapper .layui-input-group .layui-input-suffix:active{
  transform:translateY(1px);
  box-shadow:0 3px 10px rgba(14,158,142,.22);
}
.inner-page-wrapper .layui-input-group .layui-input-suffix .layui-icon{color:#fff !important;font-size:18px;}

/* 描述文字（.texts）：浅色信息条 */
.inner-page-wrapper .texts{
  margin-top:14px;
  padding-top:13px;
  border-top:1px dashed var(--i-line);
  color:var(--i-ink2);
  font-size:13.5px;
  line-height:1.78;
}

/* ---------- ⑤ 字格 / 工具卡：统一为圆角卡片（清除原装饰符） ---------- */
.inner-page-wrapper .layui-card-body.layui-row>li::before,
.inner-page-wrapper .layui-card-body.layui-row>li.stext::before,
.inner-page-wrapper .stext::before{
  content:none !important;
  display:none !important;
}
.inner-page-wrapper .layui-card-body.layui-row>li{
  list-style:none !important;
  padding:0 4px 8px !important;
  box-sizing:border-box;
}
.inner-page-wrapper .layui-card-body.layui-row>li>a{
  display:flex !important;
  align-items:center;justify-content:center;
  min-height:46px;
  padding:8px 10px !important;
  border-radius:11px !important;
  background:var(--i-soft) !important;
  border:1px solid transparent !important;
  color:var(--i-ink) !important;
  font-size:15px;font-weight:500;
  text-decoration:none;
  box-shadow:none !important;
  transform:none !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.inner-page-wrapper .layui-card-body.layui-row>li>a:hover,
.inner-page-wrapper .layui-card-body.layui-row>li>a:active{
  background:var(--i-brand-light) !important;
  border-color:rgba(47,196,174,.4) !important;
  color:var(--i-brand) !important;
  transform:none !important;
}
/* 窄列（汉字格，每行 6~8 个）：字号更大、居中 */
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-xs2>a,
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-md1>a,
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-xs3>a{
  font-size:18px !important;
  font-weight:600 !important;
  letter-spacing:1px;
}
/* 宽列（工具卡，每行 2~3 个）：左对齐、加高 */
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-xs6>a,
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-md3>a,
.inner-page-wrapper .layui-card-body.layui-row>li.layui-col-md4>a{
  justify-content:flex-start !important;
  min-height:48px;
  padding:8px 14px !important;
  font-size:14.5px !important;
}

/* ---------- ⑥ 数据表格（拼音/部首/笔画等） ---------- */
.inner-page-wrapper .layui-table{
  border-color:var(--i-line) !important;
  border-radius:12px;
  overflow:hidden;
}
.inner-page-wrapper .layui-table th{
  background:var(--i-soft) !important;
  color:var(--i-ink2) !important;
  font-weight:600;font-size:13.5px;
}
.inner-page-wrapper .layui-table th,
.inner-page-wrapper .layui-table td{
  border-color:var(--i-line) !important;
  padding:11px 12px;
  font-size:14.5px;
}
.inner-page-wrapper .layui-table tbody tr:hover{background:var(--i-brand-light) !important;}

/* ---------- ⑦ 正文阅读体验 ---------- */
.inner-page-wrapper .layui-card-body{font-size:15px;line-height:1.8;}
.inner-page-wrapper .layui-text{color:var(--i-ink2);}
.inner-page-wrapper .layui-text p{font-size:14.5px;line-height:1.85;}
.inner-page-wrapper .text-right a:hover{color:var(--i-brand) !important;}

/* ---------- ⑧ 侧栏与分栏（桌面） ---------- */
@media (min-width:768px){
  .inner-page-wrapper .layui-row.layui-col-space20>[class*="layui-col-"]{padding-left:9px !important;padding-right:9px !important;}
  .inner-page-wrapper .layui-col-md3 .layui-card-body{padding:18px !important;}
}
@media (min-width:992px){
  .inner-page-wrapper .layui-col-md3 .layui-card-body p{font-size:13.5px;line-height:1.8;}
}

/* ---------- ⑨ 移动端优先收敛（≤767px） ---------- */
@media (max-width:767px){
  .inner-page-wrapper{padding:0 12px !important;}
  .inner-page-wrapper .layui-card{border-radius:16px !important;margin-bottom:10px !important;}
  .inner-page-wrapper .layui-card-header{padding:14px 14px !important;}
  .inner-page-wrapper .layui-card-body{padding:14px !important;font-size:15.5px;line-height:1.82;}
  .inner-page-wrapper h1{font-size:21px !important;}
  .inner-page-wrapper h2{font-size:13px !important;}
  .inner-page-wrapper .layui-row.layui-col-space20{margin:0 !important;}
  .inner-page-wrapper .layui-row.layui-col-space20>[class*="layui-col-"]{padding-left:0 !important;padding-right:0 !important;}
  .inner-page-wrapper .layui-input-group{gap:8px;}
  .inner-page-wrapper .layui-input-group>.layui-input{height:48px;line-height:48px;font-size:16px;}
  .inner-page-wrapper .layui-input-group .layui-input-suffix{height:48px;padding:0 18px !important;font-size:15.5px;}
  .inner-page-wrapper .layui-card-body.layui-row>li{padding:0 3px 7px !important;}
  .inner-page-wrapper .layui-card-body.layui-row>li>a{min-height:44px;}
  .inner-page-wrapper .layui-table th,
  .inner-page-wrapper .layui-table td{padding:10px 9px;font-size:14px;}
  /* 移动端底部 Tab 留白 */
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom)) !important;}
}

/* ---------- ⑩ 深色模式安全垫（跟随系统时不刺眼） ---------- */
@media (prefers-color-scheme:dark){
  .inner-page-wrapper{--i-soft:#f7fafb;}
}

/* ---------- ⑪ 降低动效偏好 ---------- */
@media (prefers-reduced-motion:reduce){
  .inner-page-wrapper *{transition:none !important;}
}
