/* Summarizer.Free — ink violet + highlighter accent */

:root {
    --sf-ink: #241b47;        /* deep ink violet */
    --sf-primary: #5b2ee5;    /* electric violet */
    --sf-primary-dark: #4720b8;
    --sf-accent: #ffd43b;     /* highlighter yellow */
    --sf-paper: #faf9f6;      /* warm paper */
    --bs-primary: var(--sf-primary);
}

/* General */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--sf-paper);
    color: #201c33;
}

main {
    flex: 1;
}

/* Bootstrap primary re-pointed at the brand violet */
.btn-primary {
    --bs-btn-bg: var(--sf-primary);
    --bs-btn-border-color: var(--sf-primary);
    --bs-btn-hover-bg: var(--sf-primary-dark);
    --bs-btn-hover-border-color: var(--sf-primary-dark);
    --bs-btn-active-bg: var(--sf-primary-dark);
    --bs-btn-active-border-color: var(--sf-primary-dark);
}
.btn-outline-primary {
    --bs-btn-color: var(--sf-primary);
    --bs-btn-border-color: var(--sf-primary);
    --bs-btn-hover-bg: var(--sf-primary);
    --bs-btn-hover-border-color: var(--sf-primary);
    --bs-btn-active-bg: var(--sf-primary-dark);
    --bs-btn-active-border-color: var(--sf-primary-dark);
}
.text-primary { color: var(--sf-primary) !important; }
.spinner-border.text-primary { color: var(--sf-primary) !important; }
a { color: var(--sf-primary); }
a:hover { color: var(--sf-primary-dark); }

/* Navigation */
.sf-nav {
    background: #fff;
    border-bottom: 1px solid #eceaf4;
}
.navbar-brand {
    font-weight: 700;
    color: var(--sf-ink);
    letter-spacing: -0.01em;
}
.sf-logo { color: var(--sf-ink); }
.sf-nav .nav-link { color: #4a4468; }
.sf-nav .nav-link.active, .sf-nav .nav-link:hover { color: var(--sf-ink); }

/* Hero */
.sf-hero { padding-top: 2.5rem; }
.sf-hero h1 { color: var(--sf-ink); letter-spacing: -0.02em; }
.sf-highlight {
    background: linear-gradient(180deg, transparent 52%, var(--sf-accent) 52%, var(--sf-accent) 94%, transparent 94%);
    padding: 0 0.12em;
}

/* Tool card */
.sf-tool {
    border: 1px solid #e6e2f5;
    border-radius: 1rem;
}
.sf-tabs .nav-link {
    color: #4a4468;
    font-weight: 600;
}
.sf-tabs .nav-link.active {
    background: var(--sf-ink);
    color: #fff;
}
.sf-textarea {
    border-radius: 0.6rem;
    font-size: 0.95rem;
}
.sf-mode.active {
    background: var(--sf-accent);
    border-color: var(--sf-accent);
    color: var(--sf-ink);
    font-weight: 600;
}
.sf-output {
    background: #fff;
    border: 1px solid #eceaf4;
    border-left: 4px solid var(--sf-accent);
    border-radius: 0.6rem;
    padding: 1rem 1.25rem;
}
.sf-output h3 { font-size: 1rem; font-weight: 700; margin-top: 0.75rem; }
.sf-output ul { margin-bottom: 0.5rem; }
.sf-output p:last-child { margin-bottom: 0; }

/* Use-case cards / steps */
.sf-usecard { border: 1px solid #eceaf4; border-radius: 0.75rem; }
.sf-step {
    width: 2.4rem; height: 2.4rem;
    line-height: 2.4rem;
    margin: 0 auto 0.6rem;
    border-radius: 50%;
    background: var(--sf-ink);
    color: var(--sf-accent);
    font-weight: 700;
}

/* Accordion in brand colors */
.accordion-button:not(.collapsed) {
    background: #f3f0fc;
    color: var(--sf-ink);
    box-shadow: none;
}
.accordion-button:focus { box-shadow: 0 0 0 0.2rem rgba(91, 46, 229, 0.15); }

/* Footer */
.sf-footer {
    background: #fff;
    border-top: 1px solid #eceaf4;
}

/* Forms */
.form-control:focus {
    border-color: var(--sf-primary);
    box-shadow: 0 0 0 0.2rem rgba(91, 46, 229, 0.15);
}

/* Alerts */
.alert ul {
    margin: 0;
    padding-left: 1rem;
}

/* Pricing */
.pricing-card {
    border-radius: 0.75rem;
    transition: transform 0.2s;
}
.pricing-card:hover { transform: translateY(-5px); }
.pricing-card.featured { border: 2px solid var(--sf-primary); }

/* Payment form */
#card-element {
    border: 1px solid #dee2e6;
    padding: 0.75rem;
    border-radius: 0.375rem;
}

/* Loading spinner */
.spinner-border-sm {
    width: 1rem;
    height: 1rem;
}

/* Dropdown menu scrollable */
.dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}

/* Utility classes */
.hidden {
    display: none !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .display-5 {
        font-size: 2rem;
    }
}

/* API docs code blocks */
.sf-code {
    background: var(--sf-ink);
    color: #e9e6f7;
    border-radius: 0.6rem;
    padding: 1rem 1.25rem;
    font-size: 0.82rem;
    overflow-x: auto;
}
.sf-code code { color: inherit; }

/* Share row */
.sf-share a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem; height: 2.2rem;
    border-radius: 50%;
    background: #f3f0fc;
    color: var(--sf-ink);
}
.sf-share a:hover { background: var(--sf-accent); }
.sf-share svg { width: 1.1rem; height: 1.1rem; }

/* /youtube-transcript/ — transcript viewer */
.ytt-transcript {
    max-height: 24rem;
    overflow-y: auto;
    white-space: pre-wrap;
    background: #fff;
    border: 1px solid #e6e2f5;
    border-radius: 0.6rem;
    padding: 1rem 1.25rem;
    font-size: 0.92rem;
    line-height: 1.65;
    overflow-wrap: anywhere;
}
.ytt-transcript.ytt-timed { font-variant-numeric: tabular-nums; }
/* Meeting notes (/meeting-notes/) — upload row under the paste textarea */
.mn-upload {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
}
.mn-file-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    max-width: 100%;
    background: #f3f0fc;
    color: var(--sf-ink);
    border-radius: 2rem;
    padding: 0.2rem 0.5rem 0.2rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
}
.mn-file-chip #mnFileName {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 16rem;
}
.mn-file-x {
    border: 0;
    background: transparent;
    color: var(--sf-ink);
    font-size: 1.1rem;
    line-height: 1;
    padding: 0 0.2rem;
    cursor: pointer;
}
.mn-file-x:hover { color: var(--sf-primary); }
/* Format tool pages (/bullet-points/, /executive-summary/, /abstract-generator/) */
.ft-controls { row-gap: 0.75rem; }
.ft-optlabel {
    display: block;
    margin-bottom: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b6590;
}
.ft-optgroup .btn { font-size: 0.85rem; }
.ft-note {
    background: #fffbe8;
    border: 1px solid #f2e3a1;
    border-radius: 0.6rem;
    padding: 0.6rem 0.9rem;
    color: #5c5233;
}
.sf-output h4 { font-size: 0.92rem; font-weight: 700; margin-top: 0.6rem; }
.sf-output ul ul { margin-top: 0.25rem; margin-bottom: 0.25rem; }
/* /podcast/ — full-transcript disclosure under the summary */
.sf-transcript {
    border: 1px solid #eceaf4;
    border-radius: 0.6rem;
    padding: 0.75rem 1rem;
    background: #faf9fe;
}
.sf-transcript summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--sf-ink);
}
.sf-transcript-body {
    max-height: 22rem;
    overflow-y: auto;
    white-space: pre-wrap;
    font-size: 0.9rem;
    color: #444;
}
/* Chapters mode + shared /s/ pages */
.sf-chapters {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0.5rem;
}
.sf-chapters li {
    padding: 0.6rem 0;
    border-bottom: 1px solid #eceaf4;
}
.sf-chapters li:last-child { border-bottom: 0; }
.sf-ch-head { display: block; }
.sf-ch-time {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    text-decoration: none;
    margin-right: 0.35rem;
}
.sf-ch-gist {
    display: block;
    font-size: 0.9rem;
    color: #4a4468;
    margin-top: 0.15rem;
}
.sf-output h3 .sf-ch-time { margin-right: 0.45rem; }
.sf-sp-label {
    color: #6b6590;
    letter-spacing: 0.08em;
}
.sf-sp-source { word-break: break-all; }
.sf-sp-footer { border-top: 1px solid #eceaf4; }