/* XML Sitemap Generator — styles */

.xsg-tool {
	--xsg-bg: #ffffff; --xsg-fg: #1a1a1a; --xsg-muted: #6b7280; --xsg-border: #e5e7eb;
	--xsg-primary: #2563eb; --xsg-primary-fg: #ffffff; --xsg-card-bg: #f9fafb;
	--xsg-code-bg: #0f172a; --xsg-code-fg: #e2e8f0; --xsg-error: #dc2626;
	max-width: 900px; margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--xsg-fg);
}
@media (prefers-color-scheme: dark) {
	.xsg-tool { --xsg-bg: #111827; --xsg-fg: #f3f4f6; --xsg-muted: #9ca3af; --xsg-border: #374151; --xsg-card-bg: #1f2937; }
}
.xsg-tool .d-flex{
	gap:10px;
}
.xsg-tool .d-flex .xsg-field{
	width:50%;
}
.xsg-mode-tabs { display: flex; gap: 0.4rem; margin-bottom: 1rem; }
.xsg-tab-btn { padding: 0.45rem 1rem; border-radius: 999px; border: 1px solid var(--xsg-border); background: var(--xsg-bg); color: var(--xsg-fg); font-size: 0.85rem; cursor: pointer; }
.xsg-mode-tabs button {
	background:transparent !important;
}
.xsg-tab-btn.is-active { background:#0E79BF !important }
.xsg-field { margin: 1rem 0; }
.xsg-label { display: block; font-weight: 600; font-size: 0.85rem; margin: 0.75rem 0 0.35rem; }
.xsg-label:first-child { margin-top: 0; }
.xsg-input, .xsg-textarea {   
	width: 100%;
    box-sizing: border-box;
    padding: 0.75rem 0.8rem;
    border: 1px solid var(--xsg-border);
    border-radius: 3px;
    font-size: 0.9rem;
    background: var(--xsg-bg);
    color: var(--xsg-fg);
    font-family: inherit;
}

textarea#xsg-paste-urls {
    height: 90px;
}
.xsg-textarea { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; resize: vertical; }
.xsg-input:focus-visible, .xsg-textarea:focus-visible { outline: 2px solid var(--xsg-primary); outline-offset: 1px; }
.xsg-hint { margin: 0.4rem 0 0; font-size: 0.78rem; color: var(--xsg-muted); }
.xsg-btn { margin-top: 1rem; padding: 0.65rem 1.2rem; border-radius: 8px; border: 1px solid var(--xsg-border); font-size: 0.95rem; cursor: pointer; background: var(--xsg-bg); color: var(--xsg-fg); display: inline-flex; align-items: center; gap: 0.5rem; }
.xsg-btn-primary { background: var(--xsg-primary); border-color: var(--xsg-primary); color: var(--xsg-primary-fg); font-weight: 600; }
.xsg-btn:disabled { opacity: 0.7; cursor: not-allowed; }
.xsg-spinner { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.5); border-top-color: #fff; border-radius: 50%; animation: xsg-spin 0.7s linear infinite; }
@keyframes xsg-spin { to { transform: rotate(360deg); } }
.xsg-error { margin-top: 0.75rem; padding: 0.75rem 1rem; border-radius: 8px; background: rgba(220,38,38,0.1); color: var(--xsg-error); font-size: 0.9rem; }
.xsg-results { margin-top: 1.75rem; }
.xsg-output-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; }
.xsg-output-label { font-size: 0.85rem; color: #fff; font-weight: 600; }
.xsg-actions { display: flex; gap: 0.5rem; }
.xsg-output { background: var(--xsg-code-bg); color: var(--xsg-code-fg); border-radius: 8px; padding: 1rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.8rem; white-space: pre-wrap; word-break: break-word; max-height: 500px; overflow-y: auto; margin: 0; }
.xsg-output {

    /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: #0E79BF #061A2B;
}

/* Chrome, Edge, Safari */
.xsg-output::-webkit-scrollbar {
    width: 8px;
}

.xsg-output::-webkit-scrollbar-track {
    background: #061A2B;
    border-radius: 10px;
}

.xsg-output::-webkit-scrollbar-thumb {
    background: #0E79BF;
    border-radius: 10px;
}

.xsg-output::-webkit-scrollbar-thumb:hover {
    background: #1495E5;
}



@media print { .xsg-mode-tabs, .xsg-field, .xsg-btn, .xsg-actions { display: none !important; } }