/* ------------------------------------------------------------------
   Botble admin bar as a floating pill, bottom left (logged-in admins only).
   Collapsed: an "Admin" pill. Hover or keyboard focus: it grows upwards
   into a panel listing every link of the bar.
   Botble loads its admin-bar.css after the theme: the "html" prefix wins
   on specificity, !important only where Botble uses it.
   ------------------------------------------------------------------ */

/* No more 40px pushed on top of the page */
html body.show-admin-bar { margin-top: 0 !important; }

/* The pill */
html #admin_bar {
    top: auto;
    bottom: 24px;
    left: 24px;
    width: 108px;
    min-width: 0;
    height: 48px;
    border-radius: 24px;
    overflow: hidden;
    background-color: #333333;
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-family: inherit;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

/* The panel, on hover or when a link inside gets keyboard focus */
html #admin_bar:hover,
html #admin_bar:focus-within {
    width: 272px;
    height: auto;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

/* Links stacked, the "Admin" label kept at the bottom: collapsed, the links
   overflow upwards and are clipped, the label alone shows */
html #admin_bar .admin-bar-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    padding: 0 8px;
}
html #admin_bar:hover .admin-bar-container,
html #admin_bar:focus-within .admin-bar-container { padding-top: 8px; }

html #admin_bar .admin-bar-container::after { display: none; }
html #admin_bar .admin-bar-container::before {
    content: 'Admin';
    order: 99;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 48px;
    padding-left: 37px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E") 10px center / 19px 19px no-repeat;
}

/* Every link as a panel row */
html #admin_bar .admin-bar-logo a,
html #admin_bar .admin-navbar-nav li a,
html #admin_bar .admin-navbar-nav .admin-bar-dropdown-menu li a {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 12px;
    border-radius: 8px;
    color: #ffffff;
    font-size: 14px;
    line-height: 1.2;
    background: none;
}
html #admin_bar .admin-bar-logo a:hover,
html #admin_bar .admin-navbar-nav li a:hover,
html #admin_bar .admin-navbar-nav .admin-bar-dropdown-menu li a:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

/* The logo link leads to the dashboard: it becomes that row */
html #admin_bar .admin-bar-logo {
    float: none;
    height: auto;
    margin: 0;
    padding: 0;
}
html #admin_bar .admin-bar-logo img { display: none; }
html #admin_bar .admin-bar-logo a::before { content: 'Tableau de bord'; }

/* Lists: no more floats nor fixed heights */
html #admin_bar .admin-navbar-nav {
    float: none;
    margin: 0;
    padding: 0;
}
html #admin_bar .admin-navbar-nav li {
    float: none;
    position: static;
    height: auto;
    margin: 0;
    padding: 0;
    line-height: 1.2;
}

/* A dropdown's own link (Apparence, Ajouter…) becomes a small section heading */
html #admin_bar .admin-navbar-nav .admin-bar-dropdown > a {
    height: 28px;
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
html #admin_bar .admin-navbar-nav .admin-bar-dropdown > a::after { display: none; }

/* Dropdowns always open, flat inside the panel */
html #admin_bar .admin-navbar-nav .admin-bar-dropdown-menu {
    display: block;
    position: static;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
    background: none;
    white-space: normal;
}
html #admin_bar .admin-navbar-nav .admin-bar-dropdown-menu::before { display: none; }

/* The account block (profile, logout) set apart */
html #admin_bar .admin-navbar-nav-right {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}