/* Copyright 2025 Renofy Ltd. All rights reserved. */
/* Action Sidebar Component - Desktop-only sidebar actions */

/* Hide action sidebar on mobile - only shown on desktop */
.action-sidebar {
  display: none;
}

/* Desktop styles */
@media (min-width: 821px) {
  /* Container for HTMX-loaded action sidebar (tradesperson view) */
  #action-sidebar-container {
    display: flex;
    flex-direction: column;
    margin-top: 1rem;
    width: 100%;
  }

  .action-sidebar {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
  }

  /* Always visible actions section */
  .action-sidebar__always {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  /* Primary/state-dependent actions section */
  .action-sidebar__primary {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  /* Button container - horizontal layout for multiple buttons */
  .action-sidebar__buttons {
    display: flex;
    gap: 0.5rem;
    width: 100%;
  }

  .action-sidebar__buttons .action-sidebar__button {
    flex: 1; /* Equal width buttons */
  }

  /* Single buttons - full width, vertically stacked */
  .action-sidebar__button {
    width: 100%;
  }

  /* Forms inside action sidebar */
  .action-sidebar__primary form {
    width: 100%;
  }

  .action-sidebar__primary form .button {
    width: 100%;
  }

  /* Descriptive text - styled as info notice */
  .action-sidebar__description {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    text-align: center;
  }

  /* Description title - larger, bolder text to match action footer title */
  .action-sidebar__description-title {
    display: block;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    margin-bottom: 0.25rem;
  }
}