/*
 * Shared presentation layer for taxonomy research workspaces.
 * It deliberately only refines the surrounding interface; visualisation
 * surfaces (maps, trees and molecular viewers) keep their own rendering.
 */
:root {
    --ink: #243d55;
    --text: #5a7084;
    --muted: #7990a2;
    --line: #e3edf5;
    --line-deep: #d6e5f1;
    --line-strong: #c9ddeb;
    --primary: #4486bc;
    --primary-deep: #276d9e;
    --bg-head: #f7fbff;
    --shadow: 0 5px 16px rgba(38, 86, 126, .07);
    --shadow-soft: 0 3px 11px rgba(38, 86, 126, .055);
    --shadow-card: 0 4px 14px rgba(38, 86, 126, .065);
}

body,
#main {
    background: #fbfdff;
    color: var(--ink);
    font-family: Arial, "Microsoft YaHei", sans-serif;
}

@media only screen and (min-width: 1200px) {
    body .ui.ui.ui.container:not(.fluid) {
        width: auto !important;
        max-width: 1360px !important;
        margin: 0 auto !important;
    }
}

.page-shell {
    max-width: 1360px;
    margin-top: 22px;
    padding-bottom: 36px;
}

.crumb-wrap { padding-left: 2px; }

.top-nav-wrap {
    margin-top: 10px;
    padding: 4px 6px;
    border-color: var(--line);
    border-radius: 9px;
    box-shadow: var(--shadow-soft);
}

.tool-menu.ui.menu .item {
    margin: 2px !important;
    padding: .62em .88em !important;
    border-radius: 7px;
    color: #405a73;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
    font-weight: 700;
    font-synthesis: none;
}

.tool-menu.ui.menu .item:hover,
.tool-menu.ui.menu .item.active-link {
    background: #eef6fb;
    color: var(--primary-deep) !important;
}

.main-card.ui.segment {
    margin-top: 12px !important;
    padding: 8px !important;
    background: #f7fbff;
    border-color: var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.inner-card.ui.segment {
    padding: 14px 16px !important;
    background: #fff;
    border-color: var(--line);
    border-radius: 9px;
}

.page-header h1,
.page-header h2 {
    color: var(--ink);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 1.55rem;
    line-height: 1.3;
}

.page-header p {
    color: var(--text);
    font-size: 14px;
    line-height: 1.65;
}

.ui.form .field > label {
    margin-bottom: 6px;
    color: var(--ink);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
    font-weight: 700;
}

.ui.form input[type="text"],
.ui.form input[type="number"],
.ui.form select,
.ui.selection.dropdown {
    border-color: var(--line-deep) !important;
    border-radius: 7px !important;
    color: #405a73 !important;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
}

.ui.form input[type="text"]:focus,
.ui.form input[type="number"]:focus,
.ui.form select:focus {
    border-color: #9bc1df !important;
    box-shadow: 0 0 0 3px rgba(68, 134, 188, .11) !important;
}

.ui.selection.dropdown { min-height: 38px !important; }

#main .ui.button {
    min-height: 34px;
    border-radius: 7px !important;
    box-shadow: none !important;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
    font-weight: 700 !important;
}

#main .ui.primary.button {
    background: var(--primary-deep) !important;
    color: #fff !important;
}

#main .ui.primary.button:hover { background: #1e608d !important; }

#main .ui.secondary.button {
    background: #eef5fb !important;
    color: var(--primary-deep) !important;
}

.result-panel,
.viewer-card {
    border-color: var(--line-strong);
    border-radius: 10px;
    box-shadow: var(--shadow-card);
}

.result-header,
.viewer-header {
    min-height: 40px;
    padding: 10px 14px;
    background: var(--bg-head);
    border-bottom-color: var(--line);
    color: var(--ink);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
}

.viewer-card::before { border-radius: 10px; box-shadow: none; }

.table-wrap { padding: 12px; }

.result-panel table,
.result-panel .dataTables_wrapper,
.result-panel .dataTables_wrapper label,
.result-panel .dataTables_wrapper input,
.result-panel .dataTables_wrapper select {
    color: #405a73;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    font-size: 14px;
}

.result-panel table.dataTable thead th {
    color: var(--ink);
    font-weight: 700;
}

.result-panel .dataTables_wrapper input,
.result-panel .dataTables_wrapper select {
    border-color: var(--line-deep) !important;
    border-radius: 6px !important;
}

#tree-container,
.map-frame,
.structure-view {
    border-radius: 0 0 9px 9px;
}

@media (max-width: 767px) {
    .page-shell { margin-top: 14px; padding: 0 10px 24px; }
    .inner-card.ui.segment { padding: 12px !important; }
    .tool-menu.ui.menu .item { padding: .55em .7em !important; }
}