/* =========================================================
   全站 DataTables 2.x 一致化覆寫
   Metronic 會給長度選單的 <select> 套上 .form-select（block + width:100%），
   導致「顯示 _ 項結果」被撐成三行。以下用屬性選擇器（不依賴容器 class）覆寫。
   ========================================================= */

/* 長度選單容器：一律橫向排列、不折行 */
.dt-length {
    display: inline-flex !important;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
}

/* 長度選單 label：文字與 select 保持同一行 */
label[for^="dt-length"],
.dt-length label {
    display: inline-flex !important;
    align-items: center;
    gap: .5rem;
    white-space: nowrap !important;
    margin-bottom: 0 !important;
}

/* 關鍵：把被套上 .form-select 的長度 select 收成 auto 寬（否則 width:100% 撐整行） */
select[id^="dt-length"],
.dt-length select,
.dt-length .form-select {
    width: auto !important;
    min-width: 4.5rem;
    flex: 0 0 auto;
    display: inline-block !important;
}

/* 搜尋框：輸入框不要撐滿整行 */
.dt-search input[type="search"],
.dt-search .form-control {
    width: auto !important;
    display: inline-block !important;
}

.dt-search label {
    display: inline-flex !important;
    align-items: center;
    gap: .5rem;
    white-space: nowrap !important;
    margin-bottom: 0 !important;
}

/* 資訊列 / 分頁：字級與色階一致。
   垂直間距不放這裡——由 list-card 對 .dt-container > .row 統一給 1.75rem，
   與 Laravel 分頁頁的間距同一個值；這裡再加 padding 會變成兩者相加。 */
.dt-container .dt-info,
.dt-container .dt-paging {
    font-size: .875rem;
    color: #4b5675;
}

/* 底部工具列的排列：資訊列排到最前面，切齊表格左緣，與 Laravel 分頁頁的
   「顯示第 X 至 Y 筆」同一個位置。原本長度選單在前，把資訊列往右推了 135px。 */
.dt-container .dt-toolbar {
    gap: 1rem;
}
.dt-container .dt-toolbar .dt-info {
    order: -1;
    /* plugins.bundle.css 給 .dt-toolbar .dt-info 一條 margin-left:.75rem——
       那是為了跟前面的長度選單隔開。資訊列移到最前面後，這段就變成把它推離
       表格左緣的 10px 內縮，改由上面的 gap 負責間隔。 */
    margin-left: 0;
}

/* 底部那一列的左右欄還帶著 Bootstrap 的 gutter padding，會讓資訊列比表格左緣
   內縮約 10px。左欄去掉左邊、右欄去掉右邊，兩端才真的切齊表格。 */
.dt-container > .row > div:first-child { padding-left: 0; }
.dt-container > .row > div:last-child { padding-right: 0; }

/* =========================================================
   側欄桌機寬度：覆寫 KeenThemes 預設（原 265px → 230px）
   放在此檔（有 ?v 版本號、載入於 bundle 之後）以確保生效且可破快取。
   僅覆寫 --bs-app-sidebar-width（.app-sidebar 一般寬度與內容左邊界依此）；
   收合(75px)、手機抽屜由更高權重選擇器控制，不受影響。
   ========================================================= */
@media (min-width: 992px) {
    :root {
        --bs-app-sidebar-width: 230px;
    }
}
