/* Buttons Component Styles */

   .btn {
       padding: 0.75rem 1.5rem;
       border: none;
       border-radius: 4px;
       cursor: pointer;
       text-decoration: none;
       display: inline-block;
       transition: all 0.3s;
       font-size: 1rem;
       font-weight: 500;
       margin: 0.5rem;
       text-align: center;
   }

   .btn-primary {
       background-color: #B24A02;
       color: white;
       box-shadow: 0 2px 4px rgba(178, 74, 2, 0.3);
   }

   .btn-secondary {
       background-color: transparent;
       color: #B24A02;
       border: 2px solid #B24A02;

   }

   .btn-danger {
       background-color: #e74c3c;
       color: white;
   }

   .btn-create {
       background-color: #27ae60;
       color: white;
   }

   .btn:hover {
       opacity: 0.9;
       transform: translateY(-5px);
       box-shadow: 0 7px 6px rgba(178, 74, 2, 0.3);
   }

   .btn-secondary:hover {
       background-color: #B24A02;
       color: white;
   }

   .arrow-btn {
       background-color: white;
       min-width: 30px;
       min-height: 30px;
       font-size: large;
       padding: 0.5rem 1rem;
       border: none;
       border-radius: 4px;
       cursor: pointer;
       text-decoration: none;
       display: inline-block;
       transition: background-color 0.3s;
   }

   .arrow-btn:hover {
       background-color: green;
       color: white;
       opacity: 0.3;
       transform: translateY(-2px);
   }