/* ================================================
   ECOMSTAT TASKS - COMPLETE THEME OVERRIDE
   ================================================ */

/* === FORCE LIGHT MODE === */
:root, :root.dark {
    --white: #ffffff !important;
    --scheme-main: #ffffff !important;
    --site-background: #f1f5f9 !important;
    --text: #374151 !important;
    --text-strong: #111827 !important;
    --text-light: #6b7280 !important;
    --text-invert: #ffffff !important;
    --grey-50: #f8fafc !important;
    --grey-100: #f1f5f9 !important;
    --grey-200: #e2e8f0 !important;
    --grey-300: #cbd5e1 !important;
    --grey-400: #94a3b8 !important;
    --grey-500: #64748b !important;
    --grey-600: #475569 !important;
    --grey-700: #334155 !important;
    --grey-800: #1e293b !important;
    --grey-900: #0f172a !important;
    --primary: #2563eb !important;
    --primary-h: 217deg !important;
    --primary-s: 91% !important;
    --primary-l: 53% !important;
    --primary-hsl: 217deg, 91%, 53% !important;
    --link: #2563eb !important;
    --link-hover: #1d4ed8 !important;
    --input-placeholder-color: rgba(0,0,0,0.35) !important;
    --scheme-main-bis: #f8fafc !important;
    --scheme-main-ter: #f1f5f9 !important;
    --scheme-invert: #0f172a !important;
    --scheme-invert-rgb: 15, 23, 42 !important;
    --border: #e2e8f0 !important;
    --border-hover: #cbd5e1 !important;
    --card-border-color: #e2e8f0 !important;
    --background: #f1f5f9 !important;
    --menu-item-color: #334155 !important;
    --menu-item-hover-color: #111827 !important;
    --menu-item-hover-background-color: #e2e8f0 !important;
    --menu-label-color: #64748b !important;
    --input-background-color: #ffffff !important;
    --input-color: #111827 !important;
    --input-border-color: #d1d5db !important;
    --box-background-color: #ffffff !important;
    --dropdown-item-hover-background-color: #f1f5f9 !important;
    --dropdown-item-hover-color: #111827 !important;
    --logo-text-color: #1e293b !important;
}

html { color-scheme: light !important; }
body, html { background: #f1f5f9 !important; }

/* === NAVBAR === */
.navbar {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.navbar .trigger-button,
.navbar a,
.navbar span,
.navbar .username {
    color: #334155 !important;
}
.navbar .trigger-button:hover {
    color: #111827 !important;
}

/* === SIDEBAR === */
.menu-container {
    background: #ffffff !important;
    border-right: 1px solid #e2e8f0 !important;
}
.menu-container a,
.menu-container span,
.menu-container .menu-list a {
    color: #334155 !important;
    font-weight: 500 !important;
}
.menu-container .menu-list a:hover {
    background: #f1f5f9 !important;
    color: #111827 !important;
}
.menu-container .menu-list a.router-link-active,
.menu-container .menu-list a.active {
    background: #2563eb !important;
    color: #ffffff !important;
}
.menu-container .top-menu .menu-list li {
    color: #111827 !important;
}

/* === MAIN CONTENT AREA === */
.app-content {
    padding: 5rem 1.5rem 0 !important;
    max-width: 100% !important;
}
.app-content .card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
}

/* === TASK LIST - FULL WIDTH === */
.tasks, .task-list, .list-view {
    max-width: 100% !important;
    width: 100% !important;
}

/* === TASKS === */
.task {
    background: #ffffff !important;
    border-bottom: 1px solid #f1f5f9 !important;
}
.task:hover {
    background: #f8fafc !important;
}
.task .tasktext, .task a {
    color: #1e293b !important;
}
.task .done .tasktext {
    color: #94a3b8 !important;
    text-decoration: line-through !important;
}

/* === KANBAN === */
.kanban .bucket {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
}
.kanban .bucket .title {
    color: #111827 !important;
}
.kanban .tasks .task {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
}

/* === LABELS/BADGES === */
.tag, .label, .badge {
    font-weight: 500 !important;
}

/* === BUTTONS === */
.button.is-primary {
    background-color: #2563eb !important;
    color: #ffffff !important;
    border: none !important;
}
.button.is-primary:hover {
    background-color: #1d4ed8 !important;
}

/* === INPUTS === */
input, textarea, select, .input {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #111827 !important;
}
input:focus, textarea:focus, .input:focus {
    border-color: #2563eb !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

/* === PROJECT HEADER === */
h1, h2, h3, h4 {
    color: #111827 !important;
}

/* === OVERDUE DATES === */
.overdue {
    color: #dc2626 !important;
}

/* ================================================
   LOGIN PAGE
   ================================================ */
.no-auth-wrapper {
    background: #ffffff !important;
    background-image: none !important;
    padding-block-end: 0 !important;
    min-block-size: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.noauth-container .image { display: none !important; }
.noauth-container {
    max-inline-size: 420px !important;
    min-block-size: auto !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.08) !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    flex-direction: column !important;
}
.noauth-container .content {
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    padding: 2.5rem !important;
    background: #ffffff !important;
    text-align: center !important;
}
.noauth-container .logo {
    max-inline-size: 180px !important;
    margin: 0 auto 2rem auto !important;
    display: block !important;
}
div.api-config { display: none !important; }
a[href*="get-password"] { display: none !important; }
.noauth-container h1, .noauth-container h2, .noauth-container h3,
.noauth-container .title, .content-auth h1, .content-auth h2,
.content-auth h3, .content-auth .title {
    display: none !important; height: 0 !important; margin: 0 !important;
    padding: 0 !important; overflow: hidden !important;
    font-size: 0 !important; line-height: 0 !important;
}
.noauth-container label.check {
    display: flex !important; justify-content: center !important;
    align-items: center !important; gap: 0.5rem !important;
}
.noauth-container .button.is-primary,
.noauth-container button[type="submit"] {
    width: 100% !important;
    margin: 1rem auto 0 !important;
}

/* ================================================
   HIDE VIKUNJA BRANDING
   ================================================ */
.llama-cool, img[src*="llama"], svg[class*="llama"],
a[href*="vikunja.io"], [title*="Vikunja"] {
    display: none !important;
    position: absolute !important;
    width: 0 !important; height: 0 !important;
    overflow: hidden !important;
}

/* === FULL WIDTH CONTENT === */
.is-max-width-desktop,
.is-max-width-desktop .tasks,
.is-max-width-desktop .tasks .task,
.app-content .is-max-width-desktop {
    max-width: 100% !important;
    max-inline-size: 100% !important;
    width: 100% !important;
}
.loader-container,
.loader-container .content,
.task-add {
    max-inline-size: 100% !important;
    max-width: 100% !important;
}