/* Catppuccin Mocha Walker Theme — Frosted Glass */

@import "default.css";

/* --- Palette --- */
/* glass layers: low alpha + slightly cool tint */
@define-color base   rgba(220, 230, 255, 0.15);
@define-color mantle rgba(24, 24, 37, 0.55); /* was opaque */
@define-color crust  rgba(17, 17, 27, 0.80);

@define-color text       #cdd6f4;
@define-color subtext0   #a6adc8;
@define-color subtext1   #bac2de;

/* use these as “edge lights” more than solid fills */
@define-color surface0   rgba(49, 50, 68, 0.35);
@define-color surface1   rgba(69, 71, 90, 0.40);
@define-color surface2   rgba(88, 91, 112, 0.45);

@define-color overlay0   rgba(108, 112, 134, 0.70);
@define-color overlay1   rgba(127, 132, 156, 0.85);
@define-color overlay2   rgba(147, 153, 178, 0.90);

@define-color blue     #89b4fa;
@define-color lavender #b4befe;
@define-color mauve    #cba6f7;
@define-color green    #a6e3a1;
@define-color red      #f38ba8;
@define-color peach    #fab387;
@define-color yellow   #f9e2af;

/* --- Walker expected tokens --- */
@define-color foreground @text;

/* very transparent base to let compositor blur show through */
@define-color background: rgba(26, 26, 40, 0.75);

/* selection tint */
@define-color color1 @blue;

/* --- Reset --- */
#window,
#box,
#aiScroll,
#aiList,
#search,
#password,
#input,
#prompt,
#clear,
#typeahead,
#list,
child,
scrollbar,
slider,
#item,
#text,
#label,
#bar,
#sub,
#activationlabel {
    all: unset;
}

/* --- Error --- */
#cfgerr {
    background: alpha(@red, 0.35);
    margin-top: 20px;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid alpha(@red, 0.3);
    font-size: 1.1em;
}

/* --- Window --- */
#window {
    color: @foreground;
}

/* --- Main container (frosted glass card) --- */
#box {
    border-radius: 18px;
    background: @background;

    border: 1px solid alpha(@text, 0.08);

    box-shadow:
        inset 0 1px 0 alpha(@text, 0.04),
        0 8px 18px alpha(@crust, 0.4);

    padding: 28px;
}

/* --- Search “pill” --- */
#search {
    background: rgba(49, 50, 68, 0.22);
    padding: 10px 12px;
    border-radius: 14px;

    border: 1px solid alpha(@text, 0.1);
    box-shadow:
        inset 0 1px 0 alpha(@text, 0.06),
        0 6px 16px alpha(@crust, 0.35);
}

#prompt {
    margin-left: 6px;
    margin-right: 12px;
    color: alpha(@overlay1, 0.9);
}

#clear {
    color: alpha(@overlay2, 0.9);
}

/* --- Inputs --- */
#password,
#input,
#typeahead {
    border-radius: 10px;
}

#input {
    background: none;
}

#typeahead {
    color: alpha(@subtext1, 0.85);
}

#input placeholder {
    color: alpha(@overlay0, 0.75);
}

/* --- List items --- */
child {
    padding: 10px 12px;
    border-radius: 14px;
    background: @background;
    border: 1px solid alpha(@text, 0.05);
}

/* Hover / Selection: brighter glass + tinted glow */
child:selected,
child:hover {
    background: rgba(22, 22, 34, 0.8);
    border: 1px solid alpha(@text, 0.08);

    box-shadow:
        inset 0 1px 0 alpha(@text, 0.05),
        0 6px 14px alpha(@crust, 0.35);
}

/* --- Text --- */
#label {
    font-weight: 600;
}

#sub {
    color: alpha(@subtext0, 0.85);
    font-size: 0.85em;
}

/* --- Activation --- */
.activation #text,
.activation #icon,
.activation #search {
    opacity: 0.55;
}

/* --- AI Panel --- */
.aiItem {
    padding: 12px;
    border-radius: 14px;
    color: @foreground;

    /* glass tile */
    background: rgba(24, 24, 37, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: inset 0 1px 0 alpha(@text, 0.05);
}

.aiItem.assistant {
    background: rgba(49, 50, 68, 0.22);
}