﻿[data-theme="brittany"] {
    /* =============================
       CORE COLORS
       ============================= */

    --page-bg: linear-gradient(135deg, #fff0f6, #f0f9ff);
    --text-primary: #4c1d95;
    --text-muted: #9333ea;
    --border-soft: #f0abfc;
    --accent-blue: #ec4899;
    --accent-blue-soft: #fde2f3;
    --danger-soft: #ffe4e6;
    --danger-border: #f43f5e;
    /* =============================
       UI TOKENS
       ============================= */

    --project-card-bg: linear-gradient( 135deg, #ffe4e6, #fef3c7, #dcfce7, #dbeafe, #f5d0fe );
    --project-card-border: #f9a8d4;
    --project-card-border-hover: #ec4899;
    --project-card-shadow-hover: rgba(236, 72, 153, 0.4);
    --task-bg: #ffffffcc;
    --task-bg-depth-1: #fff7edcc;
    --task-bg-depth-2: #fdf2f8cc;
    --task-border: #f9a8d4;
    --task-border-hover: #ec4899;
    --task-shadow: rgba(236, 72, 153, 0.15);
    --task-shadow-hover: rgba(236, 72, 153, 0.35);
    --task-header-bg: linear-gradient(135deg, #fff1f2, #f5d0fe);
    --task-title-text: #7e22ce;
    --panel-bg: #ffffffdd;
    --panel-border: #f9a8d4;
    --panel-shadow: rgba(236, 72, 153, 0.3);
    --panel-header-primary-bg: linear-gradient( to right, #fde68a, #f9a8d4, #a5f3fc );
    --panel-header-primary-border: #ec4899;
    --panel-glow: rgba(236, 72, 153, 0.4);
    --task-completed-text: #d946ef;
    --select-bg: #fff0f6;
    --select-text: #7e22ce;
    --select-border: #f472b6;
}

    /* =============================
   RAINBOW SWIRL HOVER
   ============================= */

    [data-theme="brittany"] .project-card:hover,
    [data-theme="brittany"] .task-section:hover {
        background: linear-gradient( 270deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee, #f6d365, #fda085 );
        background-size: 400% 400%;
        animation: rainbowFlow 4s ease infinite;
        border-color: #ec4899;
    }

@keyframes rainbowFlow {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

[data-theme="brittany"] .navbar {
    background: linear-gradient(90deg, #fbc2eb, #a6c1ee);
    box-shadow: 0 4px 20px rgba(236, 72, 153, 0.4);
}

/* =============================
   Brittany Header Upgrade
   ============================= */

[data-theme="brittany"] .project-shell {
    background: linear-gradient( 120deg, #fbc2eb, #a6c1ee, #f6d365, #fda085 );
    background-size: 300% 300%;
    animation: headerFlow 8s ease infinite;
    border: 2px solid #f472b6;
    box-shadow: 0 10px 30px rgba(236, 72, 153, 0.4);
}

@keyframes headerFlow {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

[data-theme="brittany"] .project-shell h2 {
    color: #7e22ce;
    text-shadow: 0 0 6px rgba(236, 72, 153, 0.6), 0 0 12px rgba(168, 85, 247, 0.4);
}

[data-theme="brittany"] .project-shell .text-muted {
    color: #9333ea !important;
}

[data-theme="brittany"] .project-shell .btn-outline-secondary {
    border-color: #ec4899;
    color: #7e22ce;
}

    [data-theme="brittany"] .project-shell .btn-outline-secondary:hover {
        background: #f9a8d4;
        color: white;
        border-color: #ec4899;
    }

[data-theme="brittany"] .project-shell .btn-outline-primary {
    border-color: #a855f7;
    color: #7e22ce;
}

    [data-theme="brittany"] .project-shell .btn-outline-primary:hover {
        background: linear-gradient(90deg, #fbc2eb, #a6c1ee);
        color: white;
        border-color: #a855f7;
    }

/* =============================
   Brittany Icon Buttons
   ============================= */

[data-theme="brittany"] .icon-btn {
    background: linear-gradient(135deg, #fbc2eb, #a6c1ee);
    border: 1px solid #ec4899;
    color: #7e22ce;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);
    transition: all 0.3s ease;
}

    [data-theme="brittany"] .icon-btn:hover {
        transform: translateY(-2px) scale(1.1);
        box-shadow: 0 6px 20px rgba(236, 72, 153, 0.6), 0 0 15px rgba(168, 85, 247, 0.4);
    }

    /* Delete Button */
    [data-theme="brittany"] .icon-btn.danger {
        background: linear-gradient(135deg, #ff9a9e, #fecfef);
        border-color: #f43f5e;
        color: #be123c;
    }

        [data-theme="brittany"] .icon-btn.danger:hover {
            background: linear-gradient(135deg, #f43f5e, #ec4899);
            color: white;
            box-shadow: 0 6px 20px rgba(244, 63, 94, 0.7);
        }

[data-theme="brittany"] .btn-toggle {
    background: linear-gradient(135deg, #fbc2eb, #a6c1ee);
    border: 2px solid #ec4899;
    color: #7e22ce;
    box-shadow: 0 0 12px rgba(236, 72, 153, 0.4);
    transition: all 0.3s ease;
}

    [data-theme="brittany"] .btn-toggle:hover {
        transform: scale(1.2);
        box-shadow: 0 0 20px rgba(168, 85, 247, 0.7), 0 0 30px rgba(236, 72, 153, 0.5);
    }

/* =============================
   Brittany Action Buttons
   ============================= */

[data-theme="brittany"] .btn-outline-secondary {
    border-color: #ec4899;
    color: #7e22ce;
}

    [data-theme="brittany"] .btn-outline-secondary:hover {
        background: linear-gradient(90deg, #fbc2eb, #a6c1ee);
        color: white;
        border-color: #ec4899;
    }

/* Primary Button */
[data-theme="brittany"] .btn-primary {
    background: linear-gradient( 90deg, #ff9a9e, #fad0c4, #fbc2eb, #a6c1ee );
    border: none;
    color: #4c1d95;
    font-weight: 600;
    background-size: 300% 300%;
    animation: rainbowButton 6s ease infinite;
}

    [data-theme="brittany"] .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(236, 72, 153, 0.6);
    }

@keyframes rainbowButton {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

[data-theme="brittany"] .task-completed .task-title-text {
    text-decoration: line-through;
    color: #d946ef;
    text-shadow: 0 0 8px rgba(168, 85, 247, 0.6);
}

/*[data-theme="brittany"] .task-section:hover::after {
    content: "✨";
    position: absolute;
    right: 12px;
    top: 8px;
    font-size: 18px;
    animation: sparkle 1.5s ease infinite alternate;
}

@keyframes sparkle {
    0% {
        opacity: 0.5;
        transform: translateY(0);
    }

    100% {
        opacity: 1;
        transform: translateY(-3px);
    }
}*/

/* =============================
   Brittany Comments Panel
   ============================= */

[data-theme="brittany"] .comments-panel {
    background: linear-gradient( 135deg, #fff1f2, #f5d0fe, #e0f2fe );
    border: 2px solid #f472b6;
    box-shadow: 0 10px 30px rgba(236, 72, 153, 0.4), 0 0 20px rgba(168, 85, 247, 0.3);
}
    [data-theme="brittany"] .comments-panel .text-muted {
        color: #9333ea !important;
        font-style: italic;
    }

[data-theme="brittany"] .comment-item {
    background: linear-gradient( 135deg, #fdf2f8, #e0f2fe );
    border: 1px solid #f472b6;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.25);
    transition: all 0.3s ease;
}

    [data-theme="brittany"] .comment-item:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(236, 72, 153, 0.5);
    }

[data-theme="brittany"] textarea.form-control {
    background: #fff0f6;
    border: 2px solid #f9a8d4;
    color: #7e22ce;
}

    [data-theme="brittany"] textarea.form-control:focus {
        border-color: #ec4899;
        box-shadow: 0 0 10px rgba(236, 72, 153, 0.5), 0 0 20px rgba(168, 85, 247, 0.3);
    }
[data-theme="brittany"] .comments-panel .btn-primary {
    box-shadow: 0 4px 15px rgba(236, 72, 153, 0.5);
}

/* =============================
   Brittany Comment Footer
   ============================= */

[data-theme="brittany"] .comments-panel .panel-footer {
    background: linear-gradient( 90deg, #fdf2f8, #e0f2fe );
    border-top: 2px solid #f472b6;
    box-shadow: inset 0 3px 10px rgba(236, 72, 153, 0.2);
}

/* =============================
   Brittany Task Details Panel
   ============================= */

[data-theme="brittany"] .task-details-panel {
    background: linear-gradient( 135deg, #fff1f2, #f5d0fe, #e0f2fe );
    border: 2px solid #f472b6;
    box-shadow: 0 12px 30px rgba(236, 72, 153, 0.4), 0 0 20px rgba(168, 85, 247, 0.3);
}

/* =============================
   Brittany Create Task Form
   ============================= */

[data-theme="brittany"] .project-form-shell {
    background: linear-gradient( 135deg, #fff1f2, #f5d0fe, #e0f2fe );
    border: 2px solid #f472b6;
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(236, 72, 153, 0.4), 0 0 20px rgba(168, 85, 247, 0.3);
    padding: 28px;
}

/*[data-theme="brittany"]  .icon-btn {
    background: linear-gradient(135deg, #fbc2eb, #a6c1ee);
    border: 2px solid #ec4899;
    color: #7e22ce;
    border-radius: 12px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);
    transition: all 0.25s ease;
}
    [data-theme="brittany"] .task-header-right .icon-btn:hover {
        transform: translateY(-3px) scale(1.15);
        box-shadow: 0 8px 20px rgba(236, 72, 153, 0.6), 0 0 15px rgba(168, 85, 247, 0.4);
    }

    [data-theme="brittany"] .task-header-right .icon-btn.danger {
        background: linear-gradient(135deg, #ff9a9e, #fecfef);
        border-color: #f43f5e;
        color: #be123c;
    }

        [data-theme="brittany"] .task-header-right .icon-btn.danger:hover {
            background: linear-gradient(135deg, #f43f5e, #ec4899);
            color: white;
            box-shadow: 0 8px 22px rgba(244, 63, 94, 0.7);
        }
    [data-theme="brittany"] .task-header-right .icon-btn[title="Add subtask"] {
        background: linear-gradient(135deg, #dcfce7, #a7f3d0);
        border-color: #10b981;
        color: #065f46;
    }*/
/* =============================
   Brittany Universal Icon Buttons
   ============================= */

[data-theme="brittany"] .icon-btn {
    background: linear-gradient(135deg, #fbc2eb, #a6c1ee);
    border: 2px solid #ec4899;
    color: #7e22ce;
    border-radius: 12px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);
    transition: all 0.25s ease;
}

    [data-theme="brittany"] .icon-btn:hover {
        transform: translateY(-3px) scale(1.15);
        box-shadow: 0 8px 20px rgba(236, 72, 153, 0.6), 0 0 15px rgba(168, 85, 247, 0.4);
    }

    /* Danger (Delete) */
    [data-theme="brittany"] .icon-btn.danger {
        background: linear-gradient(135deg, #ff9a9e, #fecfef);
        border-color: #f43f5e;
        color: #be123c;
    }

        [data-theme="brittany"] .icon-btn.danger:hover {
            background: linear-gradient(135deg, #f43f5e, #ec4899);
            color: white;
            box-shadow: 0 8px 22px rgba(244, 63, 94, 0.7);
        }

    /* Add Subtask (optional variant) */
    [data-theme="brittany"] .icon-btn[title="Add subtask"] {
        background: linear-gradient(135deg, #dcfce7, #a7f3d0);
        border-color: #10b981;
        color: #065f46;
    }
[data-theme="brittany"] a.icon-btn,
[data-theme="brittany"] button.icon-btn {
    background: linear-gradient(135deg, #fbc2eb, #a6c1ee) !important;
    border: 2px solid #ec4899 !important;
    color: #7e22ce !important;
}
    [data-theme="brittany"] a.icon-btn:hover,
    [data-theme="brittany"] button.icon-btn:hover {
        transform: translateY(-3px) scale(1.15);
        box-shadow: 0 8px 20px rgba(236, 72, 153, 0.6), 0 0 15px rgba(168, 85, 247, 0.4);
    }


