/* ============================================================
   cd-admin.css — ชุดหน้าตาสำหรับหน้างานหลังบ้าน

   ใช้กับหน้าที่ครอบด้วย template เดิมและยังใช้คอมโพเนนต์ของ Bootstrap อยู่
   (จัดการงานวันเด็ก, ผู้จัดการจังหวัด ฯลฯ) โดยไม่ต้องรื้อ markup

   วิธีใช้: ใส่คลาส cd-admin ที่ <main> แล้วทุกอย่างข้างในจะเปลี่ยนตาม
     <main class="main cd-admin">

   ทับเฉพาะ "หน้าตา" ไม่แตะ logic ของ filter / sort / pagination
   หน้าเหล่านี้เดิมใช้สีมาตรฐานของ Bootstrap (น้ำเงิน–เขียว–เหลือง)
   ซึ่งชนกับธีมแดง–ส้มของปี ๒๕๗๐

   สีทั้งหมดอ้างตัวแปร --cd-* จาก 2570.css ซึ่ง header.php โหลดไว้ก่อนแล้ว
   ============================================================ */

.cd-admin{background:var(--cd-tint-1)}
.cd-admin .section{padding:2.2rem 0 3.5rem}
.cd-admin .container{max-width:1320px}

/* ============================================================
   หัวหน้า
   ============================================================ */
.cda-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1rem;margin-bottom:1.6rem}
.cda-head .spacer{flex:1 1 auto}
.cda-eyebrow{
  display:inline-block;background:var(--cd-tint-3);color:var(--cd-maroon);
  border-radius:999px;padding:.15rem .85rem;font-size:.82rem;margin-bottom:.45rem;
}
.cda-head h1{font-size:clamp(1.5rem,3vw,2rem);color:var(--cd-maroon);font-weight:600;margin:0}
.cda-head .sub{color:var(--cd-ink-soft);font-size:.92rem;margin:.2rem 0 0}

.cd-admin .cda-btn-new{
  background:linear-gradient(135deg,var(--cd-orange) 0%,var(--cd-orange-d) 100%);
  color:#fff;border:0;border-radius:14px;padding:.6rem 1.3rem;font-weight:500;
  display:inline-flex;align-items:center;gap:.5rem;
  box-shadow:0 8px 20px rgba(224,83,15,.22);transition:transform .15s,box-shadow .15s;
}
.cd-admin .cda-btn-new:hover{color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(224,83,15,.3)}
.cd-admin .cda-btn-ghost{
  background:#fff;border:1.5px solid var(--cd-line);color:var(--cd-ink-soft);
  border-radius:14px;padding:.6rem 1.1rem;font-weight:500;
  display:inline-flex;align-items:center;gap:.5rem;
}
.cd-admin .cda-btn-ghost:hover{border-color:var(--cd-coral);color:var(--cd-maroon)}

.cd-admin .dropdown-menu{
  border-radius:16px;border:1px solid var(--cd-line);
  box-shadow:0 12px 28px rgba(144,24,24,.14);padding:.4rem;
}
.cd-admin .dropdown-item{border-radius:10px;padding:.5rem .8rem}
.cd-admin .dropdown-item:hover{background:var(--cd-tint-2);color:var(--cd-maroon)}

/* ============================================================
   แถบเตือนตอนดูรอบปีเก่า
   ============================================================ */
.cda-pastbar{
  background:#5a3d00;color:#FFD84D;border-radius:16px;
  padding:.75rem 1.15rem;margin-bottom:1.2rem;font-size:.9rem;
  display:flex;align-items:center;gap:.65rem;
}
.cda-pastbar strong{color:#fff}
.cda-pastbar i{font-size:1.15rem;flex:none}
.cda-pastbar a{color:#FFD84D;text-decoration:underline;margin-left:auto;white-space:nowrap}

/* ตัวเลือกรอบปี */
.cda-yearpick{display:flex;align-items:center;gap:.5rem}
.cda-yearpick label{font-size:.85rem;color:var(--cd-ink-soft);white-space:nowrap;margin:0}
.cda-yearpick select{
  border:1.5px solid var(--cd-line);border-radius:14px;padding:.55rem 1rem;
  font-family:inherit;font-size:.92rem;color:var(--cd-maroon);background:#fff;cursor:pointer;outline:none;
}
.cda-yearpick select:focus{border-color:var(--cd-orange);box-shadow:0 0 0 3px rgba(240,96,24,.14)}

/* ============================================================
   การ์ดสรุปยอด — กดเพื่อกรองได้
   ============================================================ */
.cda-stats{display:grid;gap:.9rem;margin-bottom:1.4rem;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.cda-stat{
  background:#fff;border:1.5px solid var(--cd-line);border-radius:18px;
  padding:1rem 1.15rem;display:flex;align-items:center;gap:.9rem;
  box-shadow:0 6px 18px rgba(144,24,24,.05);text-decoration:none;
  transition:transform .15s,box-shadow .15s,border-color .15s;
}
.cda-stat:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(144,24,24,.10);border-color:var(--cd-coral)}
.cda-stat.on{border-color:var(--cd-maroon);border-width:2px;background:var(--cd-tint-1)}
.cda-stat .ic{width:44px;height:44px;border-radius:14px;flex:none;display:grid;place-items:center;font-size:1.2rem}
.cda-stat .n{font-size:1.6rem;font-weight:600;line-height:1.1;color:var(--cd-ink)}
.cda-stat .t{font-size:.85rem;color:var(--cd-ink-soft);line-height:1.4}
.cda-stat.s-all   .ic{background:#FFE9E0;color:var(--cd-orange-d)}
.cda-stat.s-ok    .ic{background:#DFF3E8;color:#137a45}
.cda-stat.s-wait  .ic{background:#FFF1DA;color:var(--cd-amber-d)}
.cda-stat.s-no    .ic{background:#FBE0E0;color:#B02A2A}
.cda-stat.s-draft .ic{background:#E9E4E1;color:#7A5D54}

/* ============================================================
   การ์ด / ตาราง
   ============================================================ */
.cd-admin .card{
  border-radius:20px;border:1px solid var(--cd-line);
  box-shadow:0 8px 24px rgba(144,24,24,.05);
}
.cd-admin .card-header{
  background:var(--cd-tint-2);border-bottom:1px solid var(--cd-line);
  border-radius:20px 20px 0 0;padding:.9rem 1.2rem;
}
.cd-admin .card-header h5{color:var(--cd-maroon);font-weight:600;font-size:1.05rem}

.cd-admin .form-label{font-size:.88rem;color:var(--cd-ink-soft);margin-bottom:.3rem}
.cd-admin .form-control,
.cd-admin .form-select{
  border:1.5px solid var(--cd-line);border-radius:12px;padding:.55rem .9rem;font-family:inherit;
}
.cd-admin .form-control:focus,
.cd-admin .form-select:focus{border-color:var(--cd-orange);box-shadow:0 0 0 3px rgba(240,96,24,.14)}

.cd-admin .btn-primary{
  background:linear-gradient(135deg,var(--cd-orange) 0%,var(--cd-orange-d) 100%);
  border:0;border-radius:12px;padding:.55rem 1.3rem;font-weight:500;
}
.cd-admin .btn-outline-secondary{border-color:var(--cd-line);color:var(--cd-ink-soft);border-radius:12px}
.cd-admin .btn-outline-secondary:hover{background:var(--cd-tint-2);border-color:var(--cd-coral);color:var(--cd-maroon)}

.cd-admin .table{border-collapse:separate;border-spacing:0;margin:0}
.cd-admin .table>thead th{
  background:var(--cd-tint-2);color:var(--cd-maroon);font-weight:600;
  border:0;border-bottom:2px solid var(--cd-line);padding:.85rem .8rem;font-size:.88rem;
}
.cd-admin .table>thead th a,
.cd-admin .table>thead th a.text-dark{color:var(--cd-maroon)!important;text-decoration:none}
.cd-admin .table>thead th a:hover{color:var(--cd-orange-d)!important}
.cd-admin .bi-sort-up,
.cd-admin .bi-sort-down{color:var(--cd-orange-d)!important}
.cd-admin .table>tbody td{border:0;border-bottom:1px solid #F3E7E2;padding:.85rem .8rem;font-size:.9rem}
.cd-admin .table>tbody tr:hover td{background:var(--cd-tint-1)}

/* ตารางที่ไม่ได้อยู่ในการ์ดอยู่แล้ว ให้ห่อเป็นการ์ดให้เอง */
.cd-admin > .section > .container > .table-responsive,
.cd-admin .table-responsive.as-card{
  background:#fff;border:1px solid var(--cd-line);border-radius:20px;
  padding:1rem;box-shadow:0 10px 30px rgba(144,24,24,.06);
}

/* ============================================================
   ป้ายสถานะ — พื้นอ่อน ตัวอักษรเข้ม อ่านง่ายกว่าพื้นทึบ
   ============================================================ */
.cd-admin .badge{border-radius:999px;padding:.32rem .8rem;font-weight:500;font-size:.8rem}
.cd-admin .badge.bg-success{background:#DFF3E8!important;color:#0F6136!important}
.cd-admin .badge.bg-warning{background:#FFF1DA!important;color:#9A5B02!important}
.cd-admin .badge.bg-secondary{background:#EDE7E4!important;color:#6B554D!important}
.cd-admin .badge.bg-danger{background:#FBE0E0!important;color:#96201F!important}
.cd-admin .badge.bg-info{background:#E4E4F6!important;color:var(--cd-navy)!important}
.cd-admin .badge.bg-primary{background:#FFE9E0!important;color:var(--cd-orange-d)!important}

/* ============================================================
   ปุ่มในแถวตาราง
   ============================================================ */
.cd-admin .btn-group .btn{border-radius:10px!important;margin-right:.2rem;padding:.3rem .6rem;border-width:1.5px}
.cd-admin .btn-sm{border-radius:10px;padding:.32rem .8rem;font-size:.84rem}
.cd-admin .btn-outline-info{color:var(--cd-navy);border-color:#CFCFEA}
.cd-admin .btn-outline-info:hover{background:var(--cd-navy);border-color:var(--cd-navy);color:#fff}
.cd-admin .btn-outline-primary{color:var(--cd-orange-d);border-color:var(--cd-coral)}
.cd-admin .btn-outline-primary:hover{background:var(--cd-orange-d);border-color:var(--cd-orange-d);color:#fff}
.cd-admin .btn-success{background:#137a45;border-color:#137a45}
.cd-admin .btn-success:hover{background:#0F6136;border-color:#0F6136}
.cd-admin .btn-danger{background:#B02A2A;border-color:#B02A2A}
.cd-admin .btn-danger:hover{background:#96201F;border-color:#96201F}

/* ============================================================
   เลขหน้า / แจ้งเตือน
   ============================================================ */
.cd-admin .pagination{gap:.25rem}
.cd-admin .page-link{
  border:1px solid transparent;border-radius:10px;color:var(--cd-ink-soft);
  padding:.4rem .8rem;font-size:.9rem;
}
.cd-admin .page-link:hover{background:var(--cd-tint-2);color:var(--cd-maroon)}
.cd-admin .page-item.active .page-link{background:var(--cd-maroon);border-color:var(--cd-maroon);color:#fff}
.cd-admin .page-item.disabled .page-link{opacity:.4;background:transparent}

.cd-admin .alert{border-radius:16px;border-width:1px}
.cd-admin .alert-success{background:#DFF3E8;border-color:#9FD6BA;color:#0F6136}
.cd-admin .alert-danger{background:#FBE0E0;border-color:#EFB4B4;color:#96201F}
.cd-admin .alert-info{background:var(--cd-tint-3);border-color:var(--cd-coral);color:var(--cd-maroon)}

/* สถานะว่างเปล่า */
.cda-empty{text-align:center;color:var(--cd-ink-soft);padding:2.6rem 1rem}
.cda-empty i{font-size:2.2rem;color:var(--cd-coral);display:block;margin-bottom:.5rem}
.cda-empty b{color:var(--cd-maroon)}

/* ============================================================
   ปิดกลไกสีตารางของ Bootstrap ภายในหน้าหลังบ้าน

   Bootstrap 5 ระบายสีเซลล์ด้วย box-shadow inset (ไม่ใช่ background)
   ทำให้ .table-hover / .table-light ทับสีที่เราตั้งไว้เป็นเงาเทาซ้อนอีกชั้น
   ตั้งตัวแปรให้โปร่งทั้งหมด แล้วปล่อยให้กฎ background ด้านบนทำงานตามปกติ
   ============================================================ */
.cd-admin .table{
  --bs-table-bg:transparent;
  --bs-table-accent-bg:transparent;
  --bs-table-hover-bg:transparent;
  --bs-table-striped-bg:transparent;
  --bs-table-color:inherit;
  --bs-table-hover-color:inherit;
  --bs-table-striped-color:inherit;
}

/* ---- คลาสสีข้อความของ Bootstrap ที่ยังใช้อยู่ในหน้าเดิม ----
   ปล่อยไว้จะเป็นเทา/ฟ้า/เขียวมาตรฐาน ไม่เข้าธีม */
.cd-admin .text-muted{color:var(--cd-ink-soft)!important}
.cd-admin .text-info{color:var(--cd-navy)!important}
.cd-admin .text-success{color:#137a45!important}
.cd-admin .text-warning{color:var(--cd-amber-d)!important}
.cd-admin .text-danger{color:#B02A2A!important}
.cd-admin .text-primary{color:var(--cd-orange-d)!important}
.cd-admin .text-dark{color:var(--cd-ink)!important}

/* ============================================================
   ฟอร์มสร้าง / แก้ไขงาน

   หน้าเหล่านี้ใช้คลาส .section-title ซึ่งชนกับของ main.css
   (ที่นั่นเป็นหัวข้อกลางหน้าแบบ text-align:center + padding 30px)
   จึงต้องกำหนดค่าที่ชนกันให้ครบ ไม่ใช่แค่ทับสี
   ============================================================ */
.cd-admin .form-section{
  background:#fff;border:1px solid var(--cd-line);border-radius:20px;
  padding:1.5rem;margin-bottom:1.2rem;
  box-shadow:0 8px 24px rgba(144,24,24,.05);
}
.cd-admin .form-section .section-title{
  text-align:left;position:static;
  font-size:1.1rem;font-weight:600;color:var(--cd-maroon);
  margin:0 0 1.3rem;padding:0 0 .8rem;
  border-bottom:2px solid var(--cd-tint-2);
  display:flex;align-items:center;gap:.65rem;
}
.cd-admin .form-section .section-title .ic{
  width:34px;height:34px;border-radius:11px;flex:none;
  display:grid;place-items:center;font-size:1rem;
  background:var(--cd-tint-2);color:var(--cd-orange-d);
}

.cd-admin #map{
  height:400px;width:100%;border-radius:16px;margin-bottom:1.2rem;
  border:1px solid var(--cd-line);
}

.cd-admin textarea.form-control{border-radius:14px}
.cd-admin .form-control[type=file]{padding:.45rem .9rem}
.cd-admin .form-section small{color:var(--cd-ink-soft);font-size:.84rem}

/* แถวปุ่มท้ายฟอร์ม */
.cda-formactions{
  display:flex;justify-content:flex-end;align-items:center;gap:.7rem;
  padding:1.2rem 0 .5rem;
}
.cd-admin .cda-formactions .btn-secondary{
  background:#fff;border:1.5px solid var(--cd-line);color:var(--cd-ink-soft);
  border-radius:14px;padding:.6rem 1.4rem;font-weight:500;
}
.cd-admin .cda-formactions .btn-secondary:hover{border-color:var(--cd-coral);color:var(--cd-maroon)}
.cd-admin .cda-formactions .btn-primary{border-radius:14px;padding:.6rem 1.6rem}

/* ============================================================
   หน้าตรวจใบสมัคร (/applications/adminview)

   หน้านี้แสดงข้อมูลด้วย <input readonly> / <input disabled> ทั้งหน้า
   ซึ่งจริง ๆ คือ "ข้อมูลสำหรับอ่าน" ไม่ใช่ฟอร์มให้กรอก
   จึงลดกรอบและพื้นให้ดูเป็นข้อมูล ไม่ใช่ช่องรอรับคำตอบ
   ============================================================ */
.cd-admin .appview{padding:0}
.cd-admin .appview h4{
  font-size:1.05rem;font-weight:600;color:var(--cd-maroon);
  margin:1.8rem 0 .9rem;padding-bottom:.6rem;
  border-bottom:2px solid var(--cd-tint-2);
}
.cd-admin .appview h4:first-of-type{margin-top:0}
.cd-admin .appview > hr,
.cd-admin .appview div > hr{display:none}   /* ใช้เส้นใต้หัวข้อแทน จะได้ไม่ซ้อนกัน */

.cd-admin .appview label{color:var(--cd-ink-soft);font-size:.9rem}
.cd-admin .appview .form-control[readonly],
.cd-admin .appview .form-control:disabled,
.cd-admin .appview .form-select:disabled{
  background:var(--cd-tint-1);border-color:var(--cd-line);color:var(--cd-ink);
  opacity:1;box-shadow:none;
}
.cd-admin .appview .form-check-input:disabled{opacity:.85}
.cd-admin .appview .form-check-input:checked{background-color:var(--cd-orange);border-color:var(--cd-orange)}
.cd-admin .appview .form-check-input:disabled ~ .form-check-label{opacity:1;color:var(--cd-ink)}

/* รายการไฟล์แนบ */
.cda-files a{
  display:flex;align-items:center;gap:.55rem;
  background:var(--cd-tint-1);border:1px solid var(--cd-line);border-radius:12px;
  padding:.6rem .9rem;margin-bottom:.45rem;color:var(--cd-orange-d);
  word-break:break-all;font-size:.92rem;
}
.cda-files a:hover{border-color:var(--cd-coral);background:var(--cd-tint-2);color:var(--cd-maroon)}

/* กล่องบันทึกผลการตรวจ */
.cda-review{
  background:#fff;border:2px solid var(--cd-coral);border-radius:20px;
  margin-top:1.4rem;overflow:hidden;box-shadow:0 10px 30px rgba(144,24,24,.08);
}
.cda-review .hd{
  background:var(--cd-tint-3);padding:.9rem 1.3rem;border-bottom:1px solid var(--cd-line);
  display:flex;align-items:center;gap:.6rem;
}
.cda-review .hd h4{margin:0;padding:0;border:0;color:var(--cd-maroon);font-size:1.05rem}
.cda-review .bd{padding:1.3rem}
.cda-review .form-check{
  border:1.5px solid var(--cd-line);border-radius:14px;
  padding:.7rem 1rem .7rem 2.4rem;margin-bottom:.6rem;
}
.cda-review .form-check:has(input:checked){border-color:var(--cd-orange);background:var(--cd-tint-1)}
.cda-review .form-check-label{font-weight:500;cursor:pointer}
.cda-review .text-success{color:#137a45!important}
.cda-review .text-danger{color:#B02A2A!important}

/* ป้ายสถานะบนหัวหน้า */
.cda-headbadge{
  display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;
  padding:.22rem .8rem;font-size:.85rem;font-weight:500;margin-left:.5rem;
}
.cda-headbadge.st-approved{background:#DFF3E8;color:#0F6136}
.cda-headbadge.st-rejected{background:#FBE0E0;color:#96201F}
.cda-headbadge.st-pending{background:#FFF1DA;color:#9A5B02}

/* ============================================================
   ใบสมัครของฉัน (/files)

   ผู้สมัครหนึ่งคนมีใบสมัครไม่กี่ใบ ตารางแปดคอลัมน์จึงอ่านยากเกินจำเป็น
   เปลี่ยนเป็นการ์ดรายใบ ดูบนมือถือได้โดยไม่ต้องเลื่อนแนวนอน
   ============================================================ */
.cd-admin .myfiles{padding:0}

.myf-card{
  background:#fff;border:1.5px solid var(--cd-line);border-radius:20px;
  padding:1.3rem;margin-bottom:1rem;box-shadow:0 8px 24px rgba(144,24,24,.05);
}
.myf-top{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:1rem}
.myf-type{font-size:.78rem;border-radius:999px;padding:.1rem .7rem;font-weight:500}
.myf-type.t-individual{background:#E4E4F6;color:var(--cd-navy)}
.myf-type.t-team{background:#FDEEF1;color:#A8306A}
.myf-name{font-weight:600;color:var(--cd-ink);font-size:1.05rem;margin-right:auto}

/* ป้ายสถานะ ใช้ชุดเดียวกับหน้าจัดการใบสมัคร */
.myf-card .adm-st{
  display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;
  padding:.24rem .8rem;font-size:.82rem;font-weight:500;white-space:nowrap;
}
.myf-card .st-pending{background:#FFF1DA;color:#9A5B02}
.myf-card .st-approved{background:#DFF3E8;color:#0F6136}
.myf-card .st-rejected{background:#FBE0E0;color:#96201F}

/* ตารางข้อมูลสองคอลัมน์ */
.myf-rows{display:grid;grid-template-columns:150px 1fr;gap:.55rem 1rem;margin:0}
.myf-rows dt{color:var(--cd-ink-soft);font-size:.88rem;font-weight:400}
.myf-rows dd{margin:0;color:var(--cd-ink);font-size:.92rem;overflow-wrap:anywhere}

.myf-chips{display:flex;flex-wrap:wrap;gap:.3rem}
.myf-chip{background:var(--cd-tint-2);color:var(--cd-orange-d);border-radius:8px;padding:.08rem .55rem;font-size:.82rem}
.myf-note{
  background:var(--cd-tint-1);border-left:3px solid var(--cd-coral);
  border-radius:0 10px 10px 0;padding:.5rem .8rem;font-size:.9rem;color:var(--cd-ink-soft);
}

.myf-actions{
  display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;
  margin-top:1.1rem;padding-top:1rem;border-top:1px solid #F3E7E2;
}
.myf-actions .btn-edit,
.myf-actions .btn-view,
.myf-actions .btn-del{
  display:inline-flex;align-items:center;gap:.4rem;border-radius:12px;
  padding:.45rem 1.05rem;font-size:.9rem;font-weight:500;
  border:1.5px solid transparent;cursor:pointer;font-family:inherit;
}
.myf-actions .btn-edit{background:var(--cd-orange-d);color:#fff}
.myf-actions .btn-edit:hover{background:var(--cd-maroon);color:#fff}
.myf-actions .btn-view{background:#fff;border-color:var(--cd-line);color:var(--cd-ink-soft)}
.myf-actions .btn-view:hover{border-color:var(--cd-coral);color:var(--cd-maroon)}
.myf-actions .btn-del{background:#fff;border-color:#EFB4B4;color:#B02A2A}
.myf-actions .btn-del:hover{background:#B02A2A;border-color:#B02A2A;color:#fff}
.myf-left{margin-left:auto;font-size:.84rem;color:var(--cd-amber-d);display:inline-flex;align-items:center;gap:.35rem}
.myf-left--off{color:#B9A49E}

.myf-hint{
  display:flex;gap:.7rem;margin-top:1.4rem;
  background:var(--cd-tint-3);border:1px solid var(--cd-coral);border-radius:16px;
  padding:.9rem 1.15rem;font-size:.9rem;color:var(--cd-ink-soft);line-height:1.75;
}
.myf-hint i{color:var(--cd-orange-d);font-size:1.15rem;flex:none;line-height:1.6}
.myf-hint strong{color:var(--cd-maroon)}

@media (max-width:575px){
  .myf-rows{grid-template-columns:1fr;gap:.15rem .5rem}
  .myf-rows dt{margin-top:.6rem}
  .myf-left{margin-left:0;flex-basis:100%}
}

/* หัวข้อในการ์ดรายละเอียดใบสมัคร (หน้า adminview / preview) */
.cd-admin .cda-sec-title{
  display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;
  font-size:1.05rem;font-weight:600;color:var(--cd-maroon);
  margin:0 0 .9rem;padding-bottom:.6rem;border-bottom:1px solid var(--cd-line);
}
.cd-admin .cda-sec-title i{color:var(--cd-orange-d);font-size:1rem}