/* 全站版面與 RWD 樣式集中管理並配合 Bootstrap Theme */
:root {
    --app-max-width: 1480px;
    --app-radius: 1rem;
    --app-safe-bottom: env(safe-area-inset-bottom, 0px);
}

html { scroll-behavior: smooth; }
body { min-width: 320px; }
.app-shell { max-width: var(--app-max-width); margin-inline: auto; }
.app-header { z-index: 1030; backdrop-filter: blur(12px); }
.min-w-0 { min-width: 0; }
.brand-icon { width: 2.6rem; height: 2.6rem; border-radius: .85rem; display: grid; place-items: center; background: var(--bs-primary-bg-subtle); color: var(--bs-primary); font-size: 1.15rem; }
.btn-icon { width: 2.5rem; height: 2.5rem; display: inline-grid; place-items: center; padding: 0; }
.language-button { max-width: 13rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tool-nav-wrap { overflow: hidden; border-radius: .8rem; }
.tool-nav { overflow-x: auto; scrollbar-width: thin; gap: .35rem; padding: .35rem; background: var(--bs-tertiary-bg); }
.tool-nav .nav-link { white-space: nowrap; }
.tool-card { border: 1px solid var(--bs-border-color); border-radius: var(--app-radius); box-shadow: 0 .35rem 1.2rem rgba(0,0,0,.035); }
.form-control, .form-select, .input-group > .btn { min-height: 2.75rem; }
textarea.form-control { min-height: auto; resize: vertical; }
.font-monospace { font-variant-ligatures: none; }
.result-stack { display: grid; gap: .75rem; }
.empty-result::before { content: attr(data-empty-text); display: block; padding: 2rem 1rem; border: 1px dashed var(--bs-border-color); border-radius: .75rem; text-align: center; color: var(--bs-secondary-color); }
.result-item { border: 1px solid var(--bs-border-color); border-radius: .75rem; padding: .8rem; background: var(--bs-tertiary-bg); }
.result-label { font-size: .75rem; color: var(--bs-secondary-color); margin-bottom: .25rem; }
.result-value { overflow-wrap: anywhere; word-break: break-all; }
.drop-zone { border: 2px dashed var(--bs-border-color); border-radius: 1rem; background: var(--bs-tertiary-bg); transition: border-color .15s ease, background-color .15s ease, transform .15s ease; cursor: pointer; }
.drop-zone.dragover { border-color: var(--bs-primary); background: var(--bs-primary-bg-subtle); transform: translateY(-1px); }
.file-result-item { border: 1px solid var(--bs-border-color); border-radius: .85rem; padding: .85rem; margin-bottom: .75rem; }
.file-name { overflow-wrap: anywhere; }
.hash-code { font-family: var(--bs-font-monospace); overflow-wrap: anywhere; word-break: break-all; }
.progress { height: .6rem; }
.table-md5 { min-width: 650px; }
.footer-details { overflow: hidden; transition: max-height .2s ease, opacity .2s ease; max-height: 15rem; opacity: 1; }
.footer-details.collapsed { max-height: 0; opacity: 0; padding-top: 0 !important; }
.footer-chevron { transition: transform .2s ease; }
.footer-chevron.rotated { transform: rotate(-90deg); }
.status-badge { display: inline-flex; align-items: center; gap: .35rem; }
.copy-inline { flex-shrink: 0; }

/* 手機版縮小邊距並保留安全區域與水平滑動工具列 */
@media (max-width: 767.98px) {
    .app-shell { padding-left: .75rem; padding-right: .75rem; }
    .app-header .app-shell { padding-top: max(.5rem, env(safe-area-inset-top)); }
    .brand-icon { width: 2.35rem; height: 2.35rem; }
    .language-button { max-width: 8.8rem; }
    .tool-nav { margin-inline: -.75rem; border-radius: 0; padding-left: .75rem; padding-right: .75rem; }
    .tool-card { border-radius: .8rem; }
    .tool-card .card-body { padding: 1rem; }
    .btn { min-height: 2.65rem; }
    footer { padding-bottom: var(--app-safe-bottom); }
    .footer-details { max-height: 25rem; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
