/*
 * GA1 shell: header + meniul comun, identic in toate aplicatiile GA1.
 * Sursa unica: GA1 Core (https://account.ga1.ro/ui/ga1-shell.css). Aplicatiile il incarca, nu il copiaza.
 * Toate regulile sunt sub .ga1-*, ca sa nu afecteze stilurile proprii ale aplicatiei.
 */
@import url("../css/ga1-tokens.css");

.ga1-header, .ga1-side { font-family: var(--ga1-font-sans); color: var(--ga1-text); box-sizing: border-box; }
.ga1-header *, .ga1-side * { box-sizing: border-box; }
.ga1-header a, .ga1-side a { color: inherit; text-decoration: none; }

.ga1-header { position: sticky; top: 0; z-index: 50; height: var(--ga1-header-height); display: flex; align-items: center; gap: var(--ga1-space-4); padding: 0 var(--ga1-space-4); background: var(--ga1-bg); border-bottom: 1px solid var(--ga1-border); }
.ga1-brand { display: flex; align-items: center; gap: var(--ga1-space-2); }
/* Logo oficial GA1 (pachet brand v1.1); nu se redeseneaza si nu se recoloreaza. */
.ga1-logo { display: block; height: 30px; width: auto; }
.ga1-logo-lg { height: 44px; }
.ga1-brand-app { font-weight: 700; font-size: 15px; padding-left: var(--ga1-space-3); border-left: 1px solid var(--ga1-border); color: var(--ga1-text); }
.ga1-header-spacer { flex: 1; }
.ga1-menu { position: relative; }
.ga1-menu > summary { list-style: none; cursor: pointer; padding: 6px 12px; border: 1px solid var(--ga1-border); border-radius: var(--ga1-radius); background: var(--ga1-bg); font-size: 14px; white-space: nowrap; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.ga1-menu > summary::-webkit-details-marker { display: none; }
.ga1-menu-panel { position: absolute; right: 0; top: calc(100% + 6px); min-width: 260px; padding: var(--ga1-space-2); background: var(--ga1-bg); border: 1px solid var(--ga1-border); border-radius: var(--ga1-radius); box-shadow: 0 12px 32px rgb(15 23 42 / 0.12); z-index: 60; }
.ga1-menu-panel a, .ga1-menu-panel button { display: block; width: 100%; padding: 8px 10px; border: 0; background: none; color: var(--ga1-text); text-align: left; font: inherit; font-size: 14px; border-radius: var(--ga1-radius-sm); cursor: pointer; }
.ga1-menu-panel a:hover, .ga1-menu-panel button:hover { background: var(--ga1-surface); }
.ga1-menu-panel .is-current { font-weight: 600; color: var(--ga1-accent); }
.ga1-menu-label { padding: 6px 10px 2px; font-size: 12px; color: var(--ga1-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.ga1-menu-note { display: block; padding: 8px 10px; font-size: 14px; color: var(--ga1-text-muted); }

.ga1-shell { display: grid; grid-template-columns: 240px minmax(0, 1fr); min-height: calc(100vh - var(--ga1-header-height)); }
.ga1-shell-main { min-width: 0; }
.ga1-side { border-right: 1px solid var(--ga1-border); background: var(--ga1-bg); padding: var(--ga1-space-4) var(--ga1-space-3); }
.ga1-side-toggle > summary { display: none; }
.ga1-side-group + .ga1-side-group { margin-top: var(--ga1-space-4); }
.ga1-side-label { padding: 0 10px 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ga1-text-muted); }
.ga1-side-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; border-radius: var(--ga1-radius-sm); font-size: 14px; }
.ga1-side-link:hover { background: var(--ga1-surface); }
.ga1-side-link.is-active { background: var(--ga1-surface); color: var(--ga1-accent); font-weight: 600; }
.ga1-side-app { font-size: 11px; color: var(--ga1-text-muted); font-weight: 400; }
.ga1-show-sm { display: none; }

@media (max-width: 900px) {
    .ga1-shell { display: block; }
    .ga1-side { border-right: 0; border-bottom: 1px solid var(--ga1-border); padding: var(--ga1-space-2) var(--ga1-space-3); }
    .ga1-side-toggle > summary { display: block; cursor: pointer; padding: 8px 10px; font-weight: 600; }
    .ga1-side-toggle:not([open]) .ga1-side-group { display: none; }
}

@media (max-width: 640px) {
    .ga1-header { gap: var(--ga1-space-2); padding: 0 var(--ga1-space-3); }
    .ga1-hide-sm { display: none; }
    .ga1-show-sm { display: inline; }
    .ga1-brand-app { display: none; }
    .ga1-menu > summary { max-width: 120px; padding: 6px 10px; }
    .ga1-menu-panel { position: fixed; left: var(--ga1-space-3); right: var(--ga1-space-3); top: calc(var(--ga1-header-height) + 4px); min-width: 0; }
}