/* Styles for converter tool pages only. Loaded only by those pages, never site-wide. */
.tool-panel [hidden] { display: none !important; }
.tool-panel h2 { margin-top: 0; }
.tool-step { margin-top: 1.25rem; }
.tool-step h3 { margin: 0 0 0.6rem; font-size: 1.1rem; }
.tool-step p { margin: 0 0 0.6rem; }

.tool-drop {
    border: 2px dashed #94a3b8;
    border-radius: 8px;
    padding: 1.5rem 1rem;
    text-align: center;
    background: #f8fafc;
    margin-bottom: 0.75rem;
}
.tool-drop.is-dragover { border-color: var(--primary-color); background: #eff6ff; }
.tool-drop p { margin: 0.25rem 0; }
.tool-drop .btn { margin: 0.25rem 0 0; }

.tool-panel label.tool-label { display: block; font-weight: 600; font-size: 0.9rem; margin: 0.5rem 0 0.25rem; }
.tool-panel textarea {
    width: 100%;
    min-height: 7rem;
    font-family: ui-monospace, Menlo, Consolas, monospace;
    font-size: 0.85rem;
    padding: 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    resize: vertical;
}
.tool-actions { margin: 0.5rem 0; }
.tool-actions .btn { margin: 0 0.5rem 0.5rem 0; }

.tool-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 0.75rem 1rem;
    margin-bottom: 0.75rem;
}
.tool-form-grid label { display: block; font-weight: 600; font-size: 0.85rem; margin-bottom: 0.25rem; }
.tool-form-grid select,
.tool-form-grid input[type="text"] {
    width: 100%;
    padding: 0.4rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.95rem;
    background: #fff;
}
.tool-hint { display: block; font-size: 0.8rem; color: #64748b; margin-top: 0.2rem; min-height: 1em; }
.tool-checkbox { display: inline-flex; gap: 0.4rem; align-items: center; font-size: 0.95rem; margin-bottom: 0.75rem; }

.tool-status { min-height: 1.5em; font-size: 0.9rem; color: #475569; }
.tool-error { color: var(--holiday-color); }
.tool-warnings {
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 0.5rem 1rem 0.5rem 2rem;
    margin: 0.5rem 0 0.75rem;
    font-size: 0.9rem;
}
.tool-warnings:empty { display: none; }
.tool-warnings li { margin: 0.2rem 0; }

.tool-preview { font-size: 0.88rem; margin-bottom: 0.75rem; }
.tool-preview table { border-collapse: collapse; }
.tool-preview td:first-child { color: #64748b; width: 3rem; }
.tool-panel .btn:disabled { background: #94a3b8; cursor: not-allowed; }
.tool-download { font-size: 1rem; padding: 12px 20px; }
.tool-privacy { font-size: 0.9rem; color: #475569; margin-top: 1rem; }

.tool-article ol,
.tool-article ul { margin: 0 0 1rem 1.25rem; }
.tool-article li { margin: 0.25rem 0; }
.tool-article p { margin-bottom: 0.75rem; }
.tool-article h3 { margin: 1rem 0 0.4rem; }
.tool-article code { background: #f1f5f9; padding: 0 0.25rem; border-radius: 3px; font-size: 0.9em; }