/* src/fuagent/ui/style.css */

body { 
    background-color: #f8fafc;
    /* Prevent horizontal scrollbars when right-side browser animates */
    overflow-x: hidden;
}

/* REFACTORED: Custom rule to narrow the main content area and align with the header */
.container-lg {
    max-width: 80%;
}

/* NEW: Add top padding to the page body to compensate for removed page-headers */
.page-body {
    padding-top: 1.5rem;
}

.view { 
    display: none; 
}

.view.active { 
    display: block;
}

.cursor-pointer {
    cursor: pointer;
}

.status-dot { 
    width: 10px; 
    height: 10px; 
    border-radius: 50%;
    display: inline-block; 
    margin-right: 8px; 
    vertical-align: middle;
}

.status-dot-success { 
    background-color: #2fb344;
}

.status-dot-danger { 
    background-color: #d63939; 
}

.status-dot-warning {
    background-color: #f59f00;
}

.status-dot-secondary {
    background-color: #adb5bd;
}

/* Fix for button group spacing to prevent tooltip overlap */
.card-header .btn-list {
    gap: .25rem;
}


/* === Final Navigation Bar Styles === */

/* Ensure the navbar and its inner container are full-width */
.navbar-expand-md .navbar-collapse .d-flex,
.navbar-expand-md .navbar-collapse .navbar-nav {
    width: 100%;
}

/* Make each nav item grow equally to fill the space */
.navbar-expand-md .navbar-collapse .navbar-nav .nav-item {
    flex-grow: 1;
    text-align: center; /* Center the text within each item */
}

/* Add a proper, specific highlight for the active link */
.navbar-expand-md .navbar-nav .nav-link.active {
    background-color: rgba(98, 105, 119, 0.06);
    /* A subtle background */
    border-radius: 4px;
}



/* === NEW: UI Polish to De-emphasize Page Title === */
.page-header .page-title {
    font-size: 1rem;
    font-weight: 600;
    color: #3d4a5c;
    margin-bottom: 0.25rem;
}

.page-header .text-muted {
    margin-top: 0;
    /* Bring subtitle closer to the title */
    font-size: 0.9rem;
}


/* === NEW: Visually Differentiated Action Buttons === */
/* This makes critical actions like 'delete' stand out to prevent mis-clicks */
.btn[data-action="start"],
.btn[data-action="enable"] {
    --tblr-btn-color: var(--tblr-green);
}
.btn[data-action="start"]:hover,
.btn[data-action="enable"]:hover {
    --tblr-btn-color: #fff;
    --tblr-btn-bg: var(--tblr-green);
    --tblr-btn-border-color: var(--tblr-green);
}

.btn[data-action="restart"] {
    --tblr-btn-color: var(--tblr-blue);
}
.btn[data-action="restart"]:hover {
    --tblr-btn-color: #fff;
    --tblr-btn-bg: var(--tblr-blue);
    --tblr-btn-border-color: var(--tblr-blue);
}

.btn[data-action="stop"],
.btn[data-action="disable"] {
    --tblr-btn-color: var(--tblr-orange);
}
.btn[data-action="stop"]:hover,
.btn[data-action="disable"]:hover {
    --tblr-btn-color: #fff;
    --tblr-btn-bg: var(--tblr-orange);
    --tblr-btn-border-color: var(--tblr-orange);
}

.btn[data-action="delete"] {
    --tblr-btn-color: var(--tblr-red);
}
.btn[data-action="delete"]:hover {
    --tblr-btn-color: #fff;
    --tblr-btn-bg: var(--tblr-red);
    --tblr-btn-border-color: var(--tblr-red);
}