/**
 * layout.css
 * Estilos dos componentes de layout (Sidebar, Navbar, Container, Hero, Footer).
 */
.lds-container { width: 100%; margin: 0 auto; padding: 0 var(--space-6); }
.lds-container--sm { max-width: 640px; }
.lds-container--md { max-width: 960px; }
.lds-container--lg { max-width: 1280px; }
.lds-container--full { max-width: none; }

/* Sidebar */
.lds-sidebar {
  width: 260px;
  flex-shrink: 0;
  background: var(--color-surface);
  border-right: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  padding: var(--space-5);
  transition: width 0.2s ease;
}
.lds-sidebar--collapsed { width: 84px; }
.lds-sidebar--collapsed .lds-sidebar__brand-name,
.lds-sidebar--collapsed .lds-sidebar__label,
.lds-sidebar--collapsed .lds-sidebar__user,
.lds-sidebar--collapsed .lds-sidebar__logout span { display: none; }

.lds-sidebar__brand { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-8); }
.lds-sidebar__logo { font-size: 1.5rem; color: var(--color-primary); }
.lds-sidebar__brand-name { font-weight: 700; flex: 1; }
.lds-sidebar__toggle { color: var(--color-text-secondary); padding: var(--space-1); }

.lds-sidebar__nav { display: flex; flex-direction: column; gap: var(--space-1); flex: 1; }
.lds-sidebar__link {
  display: flex; align-items: center; gap: var(--space-3);
  padding: var(--space-3); border-radius: var(--radius-md);
  color: var(--color-text-secondary); text-decoration: none; font-weight: 500;
}
.lds-sidebar__link:hover { background: var(--color-surface-alt); color: var(--color-text-primary); }
.lds-sidebar__link.is-active { background: var(--color-primary); color: #fff; }

.lds-sidebar__footer { display: flex; align-items: center; gap: var(--space-2); padding-top: var(--space-4); border-top: 1px solid var(--color-border); }
.lds-sidebar__user { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.lds-sidebar__user-name { font-size: var(--font-size-sm); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lds-sidebar__version { font-size: 0.75rem; color: var(--color-text-secondary); }
.lds-sidebar__logout { color: var(--color-text-secondary); display: flex; gap: var(--space-2); align-items: center; }

/* Navbar */
.lds-navbar { display: flex; align-items: center; gap: var(--space-6); padding: var(--space-5) var(--space-6); }
.lds-navbar__title { font-size: var(--font-size-lg); font-weight: 700; flex-shrink: 0; }
.lds-navbar__search { flex: 1; display: flex; align-items: center; gap: var(--space-2); background: var(--color-surface-alt); border-radius: var(--radius-md); padding: var(--space-2) var(--space-4); color: var(--color-text-secondary); }
.lds-navbar__search-input { background: transparent; border: none; outline: none; flex: 1; }
.lds-navbar__actions { display: flex; align-items: center; gap: var(--space-3); }
.lds-navbar__icon-btn { position: relative; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--color-surface-alt); color: var(--color-text-secondary); }
.lds-navbar__badge { position: absolute; top: -2px; right: -2px; background: var(--color-danger); color: #fff; font-size: 0.65rem; border-radius: 999px; padding: 1px 5px; }

/* Hero */
.lds-hero { text-align: center; padding: var(--space-10) 0; }
.lds-hero__title { font-size: 2.5rem; font-weight: 800; }
.lds-hero__subtitle { margin-top: var(--space-3); color: var(--color-text-secondary); font-size: var(--font-size-lg); }
.lds-hero__actions { margin-top: var(--space-6); display: flex; justify-content: center; gap: var(--space-3); }

/* Footer */
.lds-footer { text-align: center; padding: var(--space-6); color: var(--color-text-secondary); font-size: var(--font-size-sm); }

.library-page { display: flex; min-height: 100vh; }
.library-page__main { flex: 1; display: flex; flex-direction: column; }
.library-page__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-10) 0; color: var(--color-text-secondary); }
.library-page__placeholder i { font-size: 2rem; color: var(--color-primary); }

.editor-page { display: flex; min-height: 100vh; }
.editor-page__main { flex: 1; display: flex; flex-direction: column; }
.editor-page__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-10) 0; color: var(--color-text-secondary); }
.editor-page__placeholder i { font-size: 2rem; color: var(--color-primary); }

.preview-page { display: flex; min-height: 100vh; }
.preview-page__main { flex: 1; display: flex; flex-direction: column; }
.preview-page__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-10) 0; color: var(--color-text-secondary); }
.preview-page__placeholder i { font-size: 2rem; color: var(--color-primary); }

.themes-page { display: flex; min-height: 100vh; }
.themes-page__main { flex: 1; display: flex; flex-direction: column; }
.themes-page__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-10) 0; color: var(--color-text-secondary); }
.themes-page__placeholder i { font-size: 2rem; color: var(--color-primary); }

.reports-page { display: flex; min-height: 100vh; }
.reports-page__main { flex: 1; display: flex; flex-direction: column; }
.reports-page__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); padding: var(--space-10) 0; color: var(--color-text-secondary); }
.reports-page__placeholder i { font-size: 2rem; color: var(--color-primary); }
