/* ============ THƯ VIỆN PHÁP LUẬT — giao diện phẳng, đơn giản, dễ đọc ============ */
body.theme-legal {
    background: #f5f4f0;
    color: #2b2620;
}

.theme-legal .ds-brand-badge {
    background: #6b4f2a;
}

.theme-legal .ds-btn {
    background: #6b4f2a;
    color: #fff;
    border: none;
}

.theme-legal .ds-btn-outline {
    color: #6b4f2a;
    border-color: rgba(107, 79, 42, 0.35);
    background: #fff;
}

.theme-legal .ds-menu-btn.is-active {
    background: #6b4f2a;
    border-color: transparent;
    color: #fff;
}

.theme-legal .ds-menu-sidebar {
    background: #ffffff;
    border: 1px solid rgba(43, 38, 32, 0.1);
    border-radius: 16px;
}

/* Dải tổng số */
.legal-hero-bar {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #ffffff;
    border: 1px solid rgba(43, 38, 32, 0.1);
    border-radius: 16px;
    padding: 14px 18px;
    margin-bottom: 16px;
}

.legal-hero-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #6b4f2a;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.legal-hero-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.legal-hero-copy strong {
    font-size: 1.05rem;
    font-weight: 800;
    color: #2b2620;
    white-space: nowrap;
}

.legal-hero-copy span {
    font-size: 0.88rem;
    color: #6d6355;
    white-space: nowrap;
}

/* Bộ lọc */
.legal-filter-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

/* Hai control lọc luôn cùng chiều cao/bo góc/thẳng hàng:
   input và select cùng dùng biến thể --filter (46px, radius 14px) */
.legal-filter-grid .ds-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
    margin: 0;
}

.legal-filter-grid .ds-input,
.legal-filter-grid .ds-select {
    width: 100%;
    height: auto;
}

/* Hàng tiêu đề + mốc cập nhật nằm ngang nhau */
.legal-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    min-width: 0;
}

.legal-title-row h2 {
    margin: 0;
}

.legal-updated-stamp {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 700;
    color: #6b4f2a;
    background: #f3ead9;
    border: 1px solid rgba(107, 79, 42, 0.22);
    border-radius: 999px;
    padding: 5px 12px;
    white-space: nowrap;
}

.legal-updated-stamp i {
    font-size: 0.8rem;
}

/* Lưới văn bản */
.legal-doc-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.legal-doc-card {
    background: #fff;
    border: 1px solid rgba(43, 38, 32, 0.1);
    border-radius: 14px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.legal-doc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.legal-doc-type {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.legal-doc-type.is-law { background: #e8eef7; color: #1f4e8c; }
.legal-doc-type.is-constitution { background: #f9ece4; color: #a04a1f; }
.legal-doc-type.is-decree { background: #eaf6ec; color: #1e6b34; }
.legal-doc-type.is-circular { background: #f0eef9; color: #4d3f8f; }
.legal-doc-type.is-resolution { background: #fdf3e3; color: #9a6a12; }
.legal-doc-type.is-consolidated { background: #e8f3f5; color: #17606b; }
.legal-doc-type.is-other { background: #f0f0ee; color: #4c4438; }

.legal-doc-category {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: #6d6355;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.legal-doc-title {
    font-size: 1rem;
    font-weight: 800;
    color: #2b2620;
    line-height: 1.45;
    margin: 0;
}

.legal-doc-summary {
    font-size: 0.88rem;
    color: #5c5346;
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.legal-doc-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 0.8rem;
    color: #7a7061;
}

.legal-doc-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.legal-doc-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 12px;
}

/* Nút hành động trong thẻ: đồng bộ nhận diện nâu của module, phân bổ đều
   theo từng hàng (2 nút trên chia đôi, nút thừa chiếm trọn hàng dưới),
   khối nút luôn căn đáy qua margin-top:auto của cha */
.legal-doc-actions .ds-card-action {
    margin-top: 0;
    flex: 1 1 auto;
    justify-content: center;
    padding: 9px 12px;
    font-size: 0.82rem;
    white-space: nowrap;
}

.theme-legal .ds-card-action {
    color: #6b4f2a;
    background: rgba(107, 79, 42, 0.08);
    border: 1px solid rgba(107, 79, 42, 0.2);
}

.theme-legal .ds-card-action:hover {
    color: #52391d;
    background: rgba(107, 79, 42, 0.14);
}

.theme-legal .ds-card-action.is-primary {
    color: #fff;
    background: #6b4f2a;
    border-color: #6b4f2a;
}

.theme-legal .ds-card-action.is-primary:hover {
    color: #fff;
    background: #5a4223;
    border-color: #5a4223;
}

.legal-empty {
    padding: 32px 16px;
    text-align: center;
    color: #8a8071;
    background: #fff;
    border: 1px dashed rgba(43, 38, 32, 0.2);
    border-radius: 14px;
}

.legal-empty strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.95rem;
    font-weight: 800;
    color: #5c5346;
}

.legal-empty span {
    display: block;
    max-width: 46ch;
    margin: 0 auto;
    font-size: 0.85rem;
    line-height: 1.55;
}

.legal-empty .ds-card-action {
    margin-top: 14px;
}

/* Vòng focus của module theo nhận diện nâu thay vì xanh mặc định */
body.theme-legal :is(a, button, input, select, textarea, summary):focus-visible {
    outline-color: #6b4f2a;
}

/* Nguồn chính thống */
.legal-source-intro {
    font-size: 0.92rem;
    color: #5c5346;
    line-height: 1.6;
    margin: 0 0 14px;
}

.legal-source-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.legal-source-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(43, 38, 32, 0.1);
    text-decoration: none;
    color: #2b2620;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    min-width: 0;
}

.legal-source-card:hover {
    border-color: #6b4f2a;
    box-shadow: 0 2px 10px rgba(43, 38, 32, 0.08);
}

.legal-source-card i {
    font-size: 1.25rem;
    color: #6b4f2a;
}

.legal-source-card strong {
    font-size: 0.95rem;
    font-weight: 800;
}

.legal-source-card span {
    font-size: 0.82rem;
    color: #7a7061;
    line-height: 1.5;
}

/* Quản trị */
.legal-admin-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.legal-admin-form label {
    font-size: 0.88rem;
    font-weight: 700;
    color: #2b2620;
}

.legal-admin-textarea {
    min-height: 260px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
    line-height: 1.5;
}

.legal-admin-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Màn hình trung bình trở lên */
@media (min-width: 768px) {
    .legal-doc-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .legal-source-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1100px) {
    .legal-doc-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Mobile: tối ưu cho màn hình nhỏ */
@media (max-width: 767px) {
    .legal-filter-grid {
        grid-template-columns: 1fr;
    }

    .legal-hero-copy strong {
        font-size: 0.98rem;
    }

    .legal-doc-card {
        padding: 14px;
    }

    .legal-doc-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .legal-doc-actions .ds-card-action {
        width: 100%;
        justify-content: center;
    }
}

/* Phân loại văn bản: menu con của "Thư viện văn bản" trong menu trái.
   Chỉ hiện khi mục cha đang chọn — dùng bộ chọn liền kề với .is-active
   do section-menu.js điều khiển. */
.legal-submenu {
    display: none;
    margin: -4px 0 0 20px;
    padding-left: 14px;
    border-left: 2px solid rgba(107, 79, 42, 0.22);
}

.ds-menu-btn[data-menu-target="legal-library"].is-active + .legal-submenu {
    display: grid;
    gap: 4px;
}

.legal-group-tabs {
    display: grid;
    gap: 4px;
}

.legal-group-tab {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    color: #5c5346;
    font: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    text-align: left;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.legal-group-tab:hover {
    background: rgba(107, 79, 42, 0.08);
    color: #2b2620;
}

.legal-group-tab.is-active {
    background: rgba(107, 79, 42, 0.14);
    color: #4a3520;
    font-weight: 800;
}

/* Bản phân loại đặt sát danh sách (mobile) — ẩn ở desktop */
.legal-group-tabs--inline {
    display: none;
}

/* Dòng thông tin văn bản cũ bị thay thế */
.legal-doc-replaces {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 0.8rem;
    line-height: 1.35;
    color: #9a3412;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 8px;
    padding: 6px 10px;
    margin-bottom: 10px;
}

.legal-doc-replaces i {
    margin-top: 2px;
    flex-shrink: 0;
}

/* Tra cứu văn bản trực tuyến */
.legal-online-search {
    background: #fff;
    border: 1px solid rgba(107, 79, 42, 0.2);
    border-radius: 14px;
    padding: 14px;
    margin-bottom: 14px;
}

.legal-online-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.legal-online-head strong {
    font-size: 0.95rem;
    font-weight: 800;
    color: #2b2620;
}

.legal-online-head strong i {
    color: #6b4f2a;
    margin-right: 4px;
}

.legal-online-head span {
    font-size: 0.8rem;
    color: #7a7061;
}

.legal-online-row {
    display: flex;
    gap: 8px;
}

.legal-online-row .ds-input {
    flex: 1;
    min-width: 0;
}

.legal-online-row .ds-btn {
    flex-shrink: 0;
    background: #6b4f2a;
    color: #fff;
    border: none;
    white-space: nowrap;
}

.legal-online-results {
    margin-top: 12px;
}

.legal-online-hint {
    font-size: 0.85rem;
    color: #5c5346;
    background: #faf7f2;
    border: 1px solid rgba(107, 79, 42, 0.15);
    border-radius: 10px;
    padding: 8px 12px;
    margin-bottom: 10px;
}

.legal-online-card {
    background: #faf8f4;
    border: 1px solid rgba(43, 38, 32, 0.1);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.legal-online-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    font-size: 0.78rem;
    color: #7a7061;
    align-items: center;
}

.legal-online-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.legal-online-badge {
    color: #1e6b34;
    background: #eaf6ec;
    border-radius: 999px;
    padding: 3px 10px;
    font-weight: 700;
}

.legal-online-badge.is-new {
    color: #6b4f2a;
    background: #f3ead9;
}

.legal-online-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: #2b2620;
    line-height: 1.45;
    margin: 0;
}

.legal-online-note {
    font-size: 0.78rem;
    color: #8a8071;
    margin: 0;
}

.legal-empty.is-loading {
    color: #6d6355;
}

/* Mobile: ô tra cứu trực tuyến gọn */
@media (max-width: 767px) {
    .legal-online-head span {
        width: 100%;
    }

    .legal-online-row {
        flex-direction: column;
        align-items: stretch;
    }

    .legal-online-row .ds-btn {
        justify-content: center;
    }
}

/* Khu vực in PDF — ẩn trên màn hình, chỉ hiện khi in/lưu PDF */
#legalPrintArea {
    display: none;
}

@media print {
    @page {
        margin: 14mm 12mm;
    }

    body.theme-legal {
        background: #fff !important;
    }

    body.theme-legal .ds-shell,
    body.theme-legal .ds-detail-overlay {
        display: none !important;
    }

    #legalPrintArea {
        display: block !important;
        color: #1a1a1a;
        font-size: 12.5pt;
        line-height: 1.55;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .legal-print-head {
        border-bottom: 2px solid #6b4f2a;
        padding-bottom: 10px;
        margin-bottom: 14px;
    }

    .legal-print-kicker {
        font-size: 9pt;
        font-weight: 700;
        letter-spacing: 0.04em;
        color: #6b4f2a;
        margin-bottom: 6px;
    }

    .legal-print-title {
        font-size: 16pt;
        line-height: 1.35;
        margin: 0 0 4px;
        font-weight: 800;
    }

    .legal-print-sub {
        font-size: 10.5pt;
        color: #444;
    }

    .legal-print-row {
        display: flex;
        gap: 12px;
        padding: 7px 0;
        border-bottom: 1px solid #e4e4e4;
        break-inside: avoid;
    }

    .legal-print-label {
        flex: 0 0 180px;
        font-weight: 700;
        color: #333;
    }

    .legal-print-value {
        flex: 1;
        white-space: pre-line;
        color: #111;
    }

    .legal-print-foot {
        margin-top: 14px;
        font-size: 10pt;
        word-break: break-all;
    }

    .legal-print-note {
        margin-top: 10px;
        font-size: 9pt;
        color: #555;
        border-top: 1px solid #ddd;
        padding-top: 8px;
    }
}

/* Mobile: submenu trong sidebar ẩn (menu trái chuyển thành hàng nút cuộn ngang),
   phân loại chuyển thành hàng pill cuộn ngang đặt sát danh sách.
   Ngưỡng 719px khớp với điểm .ds-menu-list chuyển sang flex trong digital-services.css */
@media (max-width: 719px) {
    .legal-submenu {
        display: none !important;
    }

    .legal-group-tabs--inline {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 4px;
        margin-bottom: 12px;
        scrollbar-width: none;
    }

    .legal-group-tabs--inline::-webkit-scrollbar {
        display: none;
    }

    /* Touch target tối thiểu 44px cho hàng pill cuộn ngang */
    .legal-group-tabs--inline .legal-group-tab {
        width: auto;
        min-width: max-content;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        padding: 8px 16px;
        font-size: 0.88rem;
        border-radius: 999px;
        background: #fff;
        border: 1px solid rgba(43, 38, 32, 0.14);
    }

    .legal-title-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

/* Biến thể panel cho Tra cứu trực tuyến (khi đứng riêng 1 pane) */
.legal-online-search--panel {
    padding: 16px;
}

.legal-online-search--panel .legal-online-row {
    margin-bottom: 12px;
}

.legal-online-search--panel .legal-online-row .ds-input {
    min-height: 46px;
    border-radius: 14px;
}

.legal-online-search--panel .legal-online-row .ds-btn {
    border-radius: 14px;
    min-height: 46px;
}

/* --- Tóm tắt nội dung (AI + fallback) và nguồn tra cứu đa nguồn --- */
.legal-summary-block {
    margin-top: 12px;
    padding: 14px 16px;
    border: 1px solid var(--ds-hairline, #e2e8f0);
    border-left: 3px solid var(--ds-primary, #1d4ed8);
    border-radius: 12px;
    background: var(--ds-primary-softer, rgba(37, 99, 235, 0.05));
    font-size: 0.92rem;
    line-height: 1.6;
}

.legal-summary-block.is-loading {
    color: var(--ds-muted, #556274);
    border-left-color: var(--ds-faint, #94a3b8);
}

.legal-summary-block.is-error {
    border-left-color: var(--ds-danger, #dc2626);
    color: var(--ds-danger, #dc2626);
}

.legal-summary-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--ds-primary, #1d4ed8);
    margin-bottom: 8px;
}

.legal-summary-badge.is-fallback {
    color: var(--ds-muted, #556274);
}

.legal-summary-lines {
    margin: 4px 0 8px;
    padding-left: 18px;
    display: grid;
    gap: 6px;
}

.legal-summary-lines li {
    color: var(--ds-ink-soft, #334155);
}

.legal-summary-note {
    display: block;
    font-size: 0.78rem;
    color: var(--ds-faint, #94a3b8);
}

.legal-online-source {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    color: var(--ds-muted, #556274);
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.legal-online-source.is-chinhphu { color: var(--ds-primary, #1d4ed8); }
.legal-online-source.is-vbpl { color: var(--ds-info, #0369a1); }

.legal-online-sources {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
}

.legal-source-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--ds-hairline, #e2e8f0);
    background: var(--ds-surface, #fff);
    font-size: 0.78rem;
    color: var(--ds-muted, #556274);
}

.legal-source-chip.is-ok { color: var(--ds-success, #15803d); border-color: currentColor; }
.legal-source-chip.is-error { color: var(--ds-danger, #dc2626); border-color: currentColor; }

.legal-online-links {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 0.9rem;
}

.legal-online-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--ds-primary, #1d4ed8);
    font-weight: 600;
    text-decoration: none;
}

.legal-online-links a:hover { text-decoration: underline; }

@media (max-width: 768px) {
    .legal-online-source { max-width: 100%; white-space: normal; }
    .legal-summary-block { padding: 12px; }
}