/**
 * StoryWeaver — StoryWeaver.online-inspired default theme
 *
 * Pulls from the public landing page's gold / forest palette and
 * fantasy-book presentation while staying readable for the app UI.
 */

@import url('default.css');

:root {
    --sw-font-sans: "Palatino Linotype", "Book Antiqua", Georgia, serif;
    --sw-font-serif: "Palatino Linotype", "Book Antiqua", Georgia, serif;
    --sw-color-bg: #e5d18a;
    --sw-color-surface: rgba(255, 250, 235, 0.9);
    --sw-color-text: #25180f;
    --sw-color-text-muted: #6a5743;
    --sw-color-border: rgba(77, 58, 36, 0.24);
    --sw-color-primary: #3f6b35;
    --sw-color-primary-hover: #2f5427;
    --sw-color-primary-light: rgba(63, 107, 53, 0.12);
    --sw-color-success: #215f2f;
    --sw-color-success-bg: rgba(33, 95, 47, 0.12);
    --sw-color-error: #8b2e24;
    --sw-color-error-bg: rgba(139, 46, 36, 0.12);
    --sw-color-info: #365f82;
    --sw-color-info-bg: rgba(54, 95, 130, 0.12);
    --sw-color-warning: #8a5b12;
    --sw-color-warning-bg: rgba(138, 91, 18, 0.12);
    --sw-shadow: 0 8px 22px rgba(47, 33, 18, 0.08);
    --sw-shadow-lg: 0 20px 45px rgba(27, 18, 10, 0.18);
}

body {
    background:
        linear-gradient(180deg, rgba(17, 11, 7, 0.3), rgba(17, 11, 7, 0.16)),
        radial-gradient(circle at top, rgba(255, 249, 223, 0.65), transparent 38%),
        linear-gradient(180deg, rgba(73, 104, 47, 0.26), rgba(0, 0, 0, 0) 18%),
        url('../_assets/sw-background.png'),
        linear-gradient(180deg, #e4d08a 0%, #c8b062 100%);
    background-position: center top, center top, center top, center top, center top;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, auto, cover, cover;
    background-attachment: scroll, scroll, scroll, fixed, fixed;
    color: var(--sw-color-text);
}

.sw-nav {
    background: rgba(33, 22, 12, 0.88);
    backdrop-filter: blur(8px);
    border-bottom-color: rgba(255, 241, 202, 0.15);
    box-shadow: 0 12px 24px rgba(21, 14, 8, 0.18);
}

.sw-nav-brand,
.sw-nav-brand:hover {
    color: #f2df9d;
}

.sw-nav-link,
.sw-nav-button {
    color: rgba(255, 244, 214, 0.9);
}

.sw-nav-user {
    color: #fff7de;
    background: rgba(255, 246, 216, 0.08);
    border-color: rgba(255, 241, 202, 0.15);
}

.sw-nav-link:hover,
.sw-nav-button:hover,
.sw-nav-link-active {
    color: #f8efc9;
    background: rgba(76, 128, 61, 0.28);
    border-color: rgba(248, 239, 201, 0.12);
}

.sw-container,
.sw-container-narrow {
    position: relative;
    margin-top: 1.25rem;
    margin-bottom: 1.75rem;
    background: rgba(233, 189, 95, 0.7);
    border: 1px solid rgba(77, 58, 36, 0.16);
    border-radius: 28px;
    box-shadow: 0 24px 56px rgba(27, 18, 10, 0.22);
    backdrop-filter: blur(6px);
}

.sw-card,
.sw-help-card,
.sw-help-section,
.sw-key-item,
.sw-admin-item,
.sw-modal,
.sw-gen-modal {
    background: rgba(255, 249, 236, 0.92);
    border-color: rgba(77, 58, 36, 0.16);
    box-shadow: var(--sw-shadow-lg);
}

.sw-auth-card {
    background: rgba(26, 19, 13, 0.68);
    color: #fff6de;
    border: 1px solid rgba(255, 241, 202, 0.15);
    box-shadow: var(--sw-shadow-lg);
}

.sw-auth-card .sw-auth-subtitle,
.sw-auth-card .sw-auth-footer a {
    color: rgba(255, 244, 214, 0.9);
}

.sw-auth-card .sw-form-group label {
    color: #fff6de;
}

.sw-auth-card h1 {
    color: #f2df9d;
    text-shadow: 0 2px 12px rgba(76, 175, 80, 0.3);
}

.sw-btn-primary {
    background: linear-gradient(180deg, #4d8a3c 0%, #2f5d27 100%);
    border-color: rgba(33, 49, 23, 0.35);
}

.sw-btn-primary:hover {
    background: linear-gradient(180deg, #5b9b49 0%, #2d5325 100%);
}

.sw-btn-secondary {
    background: rgba(255, 249, 236, 0.88);
    border-color: rgba(77, 58, 36, 0.18);
}

.sw-story-item,
.sw-help-card,
.sw-key-item,
.sw-admin-item {
    border-radius: 14px;
}

.sw-story-item:hover,
.sw-help-card:hover {
    box-shadow: var(--sw-shadow-lg);
}

.sw-node-content {
    background: rgba(255, 251, 240, 0.78);
    padding: 1.25rem 1.4rem;
    border-radius: 14px;
    box-shadow: var(--sw-shadow);
}

.sw-choices li a {
    background: rgba(78, 123, 59, 0.1);
    border-color: rgba(63, 107, 53, 0.2);
    color: var(--sw-color-primary);
}

.sw-choices li a:hover {
    background: var(--sw-color-primary);
    color: #fff;
}

.sw-input,
textarea.sw-input,
select.sw-input {
    background: rgba(255, 253, 247, 0.95);
    border-color: rgba(77, 58, 36, 0.18);
}

.sw-input:focus {
    box-shadow: 0 0 0 3px rgba(63, 107, 53, 0.18);
}

.sw-help-kicker,
.sw-tab-active,
.sw-breadcrumb a:hover {
    color: var(--sw-color-primary);
}