/* budget2569.css — งบประมาณประจำปี พ.ศ. 2569 (views/bmabudget2569/index.php) ; โทนสีจาก t1-pro.css (--t1p-*) ; --c = สีประเภทงบ */

/* สัดส่วนประเภทงบ */
.bud69 .bd-types { margin: 18px 0 16px; padding: 14px 16px; background: #fff; border: 1px solid var(--t1p-rule, #CFDACB); }
.bud69 .bd-bar { display: flex; height: 16px; overflow: hidden; border-radius: 4px; background: var(--t1p-band, #EEF2EA); }
.bud69 .bd-bar a { display: block; min-width: 3px; transition: filter .15s; }
.bud69 .bd-bar a:hover { filter: brightness(1.12); }
.bud69 .bd-type-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin-top: 12px; }
.bud69 .bd-type { display: flex; flex-direction: column; gap: 2px; padding: 9px 12px; border: 1px solid var(--t1p-rule-soft, #E3EAE0); border-left: 4px solid var(--c);
  color: var(--t1p-ink, #17251C) !important; text-decoration: none !important; transition: background .15s; }
.bud69 .bd-type:hover { background: #FAFBF8; }
.bud69 .bd-type.is-sel { background: #FBF6EA; border-color: var(--t1p-gold, #A97D2F); border-left-color: var(--c); }
.bud69 .bd-type-name { font-size: 13px; font-weight: 600; }
.bud69 .bd-type b { font: 600 18px/1.2 'IBM Plex Mono', monospace; color: var(--t1p-green-deep, #123B27); }
.bud69 .bd-type small { font-size: 11.5px; color: var(--t1p-faint, #7C877D); }

.bud69 .bd-modes { flex-wrap: wrap; margin: 14px 0 10px; }
.bud69 .bd-sortbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 14px; margin: 0 0 8px; font-size: 13px; }
.bud69 .bd-sorts { color: var(--t1p-faint, #7C877D); }
.bud69 .bd-sorts a { margin-left: 8px; color: var(--t1p-green, #1F6D45); text-decoration: none; }
.bud69 .bd-sorts a.is-sel { font-weight: 700; text-decoration: underline; color: var(--t1p-green-deep, #123B27); }

/* การ์ด */
.bud69 .bd-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.bud69 .bd-card { position: relative; display: flex; flex-direction: column; gap: 7px; border-top: 3px solid var(--c, var(--t1p-green, #1F6D45)); transition: box-shadow .15s, transform .15s; }
.bud69 .bd-card:hover { box-shadow: 0 6px 18px rgba(18, 59, 39, .12); transform: translateY(-1px); }
.bud69 .bd-card .bd-link::after { content: ''; position: absolute; inset: 0; }
.bud69 .bd-card:focus-within { outline: 2px solid var(--t1p-focus, #A97D2F); outline-offset: 2px; }
.bud69 .bd-head { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.bud69 .bd-pill { padding: 1px 8px; border-radius: 10px; font-size: 11.5px; background: color-mix(in srgb, var(--c) 14%, #fff); color: color-mix(in srgb, var(--c) 75%, #000); white-space: nowrap; }
.bud69 .bd-amount { color: var(--t1p-soft, #4B5B4F); font-size: 13px; }
.bud69 .bd-amount b { font: 600 22px/1.15 'IBM Plex Mono', monospace; color: var(--t1p-green-deep, #123B27); }
.bud69 .bd-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: auto; padding-top: 6px; border-top: 1px solid var(--t1p-rule-soft, #E3EAE0); }
.bud69 .bd-tag { padding: 1px 8px; border: 1px solid var(--t1p-rule, #CFDACB); border-radius: 10px; font-size: 11.5px; color: var(--t1p-soft, #4B5B4F); background: #fff; }
.bud69 .bd-tag.is-flag { border-color: transparent; background: var(--t1p-band, #EEF2EA); }
.bud69 .bd-row { border-left: 3px solid var(--c, var(--t1p-green, #1F6D45)); }
.bud69 .bd-row .dv-row-val small { display: block; font-size: 11px; color: var(--t1p-faint, #7C877D); font-weight: 400; }
.bud69 .bd-dot { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 2px; vertical-align: middle; }

/* สรุปตามกลุ่ม */
.bud69 .bd-gcard { border-top-color: var(--t1p-green, #1F6D45); }
.bud69 .bd-meter { display: block; height: 6px; border-radius: 3px; background: var(--t1p-band, #EEF2EA); overflow: hidden; }
.bud69 .bd-meter i { display: block; height: 100%; background: var(--t1p-green, #1F6D45); }
.bud69 .bd-stack { display: flex; height: 10px; min-width: 90px; overflow: hidden; border-radius: 5px; background: var(--t1p-band, #EEF2EA); }
.bud69 .bd-stack i { display: block; height: 100%; }
.bud69 .bd-gcard .dv-tile-meta { display: flex; justify-content: space-between; }
.bud69 .bd-more { color: var(--t1p-green, #1F6D45); font-weight: 600; }
.bud69 .dv-tbl tfoot th { background: var(--t1p-band, #EEF2EA); font-weight: 600; }

@media (max-width: 640px) {
  .bud69 .bd-grid { grid-template-columns: 1fr; }
  .bud69 .bd-type-list { grid-template-columns: 1fr 1fr; }
}