@import "master_theme_ui.css";

/* ===================== TERMINAL ===================== */
.terminal {
    background: var(--grad-2); /* gradient for panel background */
    color: var(--color-text);
    border-radius: var(--radius-md);
    padding: var(--space-md);
    width: 100%;
    height: 100%;
    margin: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ===================== LOGS ===================== */
.logs {
    height: 40vh;
    overflow-y: auto;
    font-size: 13px;
    line-height: 1.4;
    color: var(--color-text);
    background: transparent; /* let gradient show */
}

.line {
    white-space: normal;
}

/* ===================== LOG ELEMENT COLORS ===================== */
.time {
    color: var(--color-link);
}

.pid {
    color: var(--color-success);
}

.level-I {
    color: var(--color-success);
}

.level-D {
    color: var(--color-link);
}

.level-W {
    color: var(--color-warning);
}

.level-E {
    color: var(--color-danger);
}

.tag {
    color: var(--color-primary);
}

/* ===================== BOOT PROGRESS ===================== */
.boot-progress {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background: transparent;
    z-index: 1;
    flex-direction: column;
    position: relative;
    top: 0rem;
    transform-origin: center center;
}

.progress-ring {
    transform: rotate(-90deg);
}

.progress-ring-bg {
    fill: none;
    stroke: var(--color-primary-soft); /* updated from android-green-soft */
    stroke-width: 8;
}

.progress-ring-circle {
    fill: none;
    stroke: var(--color-primary); /* updated from android-green */
    stroke-width: 8;
    stroke-linecap: round;
    stroke-dasharray: 339.29;
    stroke-dashoffset: 339.29;
    transition: stroke-dashoffset 0.25s ease-in-out, stroke 0.3s ease;
}

.progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    color: var(--color-success);
    font-family: monospace;
    pointer-events: none;
}

/* ===================== ANIMATIONS ===================== */
@keyframes rotateFadeOut {
    from {
        transform: rotate(0deg) scale(1);
        opacity: 1;
    }
    to {
        transform: rotate(360deg) scale(0.65);
        opacity: 0;
    }
}

.boot-progress.fade-out-rotate {
    animation: rotateFadeOut 1.2s ease-in-out forwards;
    pointer-events: none;
}

@keyframes fadeOutShrink {
    from {
        transform: scale(1);
        opacity: 1;
    }
    to {
        transform: scale(0.45);
        opacity: 0;
    }
}

.terminal.fade-out-shrink {
    animation: fadeOutShrink 1s ease-in-out forwards;
    pointer-events: none;
}