/* ===== Dragon Ball Z Bootstrap Theme ===== */
    /* Tamsi naktis su DBZ spalvomis */

    /* ===== CSS Variables ===== */
    :root {
      /* Dragon Ball Z Spalvos */
      --dbz-orange: #ff6b35;        /* Goku orange */
      --dbz-blue: #4ecdc4;          /* Gohan blue */
      --dbz-yellow: #ffe66d;        /* Super Saiyan yellow */
      --dbz-red: #ff4757;           /* Vegeta red */
      --dbz-purple: #a55eea;        /* Majin purple */
      --dbz-green: #2ed573;         /* Namek green */
      --dbz-pink: #ff6b9d;          /* Bulma pink */
      
      /* Tamsi naktis spalvos */
      --night-black: #0a0a0a;
      --night-dark: #1a1a1a;
      --night-gray: #2d2d2d;
      --night-light: #404040;
      --night-white: #f8f9fa;
      
      /* Gradients */
      --dbz-gradient-orange: linear-gradient(135deg, var(--dbz-orange), #ff8c42);
      --dbz-gradient-blue: linear-gradient(135deg, var(--dbz-blue), #6dd5ed);
      --dbz-gradient-yellow: linear-gradient(135deg, var(--dbz-yellow), #ffd93d);
      --dbz-gradient-red: linear-gradient(135deg, var(--dbz-red), #ff6b6b);
      
      /* Typography */
      --font-primary: 'Roboto', sans-serif;
      
      /* Transitions */
      --transition-normal: all 0.3s ease;
      --transition-fast: all 0.15s ease;
      --transition-slow: all 0.5s ease;
      
      /* Shadows */
      --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
      --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);
      --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2);
      --shadow-glow: 0 0 20px rgba(255, 107, 53, 0.3);
      }
      
      /* ===== Base Styles ===== */
      body {
      background: var(--night-black);
      color: var(--night-white);
      font-family: var(--font-primary);
      line-height: 1.6;
      }
      
      /* ===== Typography ===== */
      h1, h2, h3, h4, h5, h6 {
      font-family: var(--font-primary);
      color: var(--dbz-orange);
      text-shadow: 0 0 10px rgba(255, 107, 53, 0.5);
      }
      
      .display-1, .display-2, .display-3, .display-4 {
      font-family: var(--font-primary);
      color: var(--dbz-orange);
      text-shadow: 0 0 15px rgba(255, 107, 53, 0.7);
      }
      
      .text-primary { color: var(--dbz-orange) !important; }
      .text-secondary { color: var(--dbz-blue) !important; }
      .text-success { color: var(--dbz-green) !important; }
      .text-danger { color: var(--dbz-red) !important; }
      .text-warning { color: var(--dbz-yellow) !important; }
      .text-info { color: var(--dbz-blue) !important; }
      .text-light { color: var(--night-white) !important; }
      .text-dark { color: var(--night-black) !important; }
      
      /* ===== Background Colors ===== */
      .bg-primary { background-color: var(--dbz-orange) !important; }
      .bg-secondary { background-color: var(--dbz-blue) !important; }
      .bg-success { background-color: var(--dbz-green) !important; }
      .bg-danger { background-color: var(--dbz-red) !important; }
      .bg-warning { background-color: var(--dbz-yellow) !important; }
      .bg-info { background-color: var(--dbz-blue) !important; }
      .bg-light { background-color: var(--night-light) !important; }
      .bg-dark { background-color: var(--night-dark) !important; }
      .bg-night { background-color: var(--night-black) !important; }
      
      /* ===== Gradient Backgrounds ===== */
      .bg-gradient-primary { background: var(--dbz-gradient-orange) !important; }
      .bg-gradient-secondary { background: var(--dbz-gradient-blue) !important; }
      .bg-gradient-success { background: linear-gradient(135deg, var(--dbz-green), #7bed9f) !important; }
      .bg-gradient-danger { background: var(--dbz-gradient-red) !important; }
      .bg-gradient-warning { background: var(--dbz-gradient-yellow) !important; }
      .bg-gradient-info { background: var(--dbz-gradient-blue) !important; }
      
      /* ===== Buttons ===== */
      .btn {
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      border-radius: 8px;
      transition: var(--transition-normal);
      position: relative;
      overflow: hidden;
      font-family: var(--font-primary);
      }
      
      .btn::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
      transition: var(--transition-normal);
      }
      
      .btn:hover::before {
      left: 100%;
      }
      
      .btn-primary {
      background: var(--dbz-gradient-orange);
      border: none;
      color: var(--night-black);
      box-shadow: var(--shadow-sm);
      }
      
      .btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      background: var(--dbz-gradient-orange);
      color: var(--night-black);
      }
      
      .btn-secondary {
      background: var(--dbz-gradient-blue);
      border: none;
      color: var(--night-black);
      box-shadow: var(--shadow-sm);
      }
      
      .btn-secondary:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      background: var(--dbz-gradient-blue);
      color: var(--night-black);
      }
      
      .btn-success {
      background: var(--dbz-green);
      border: none;
      color: var(--night-black);
      box-shadow: var(--shadow-sm);
      }
      
      .btn-success:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      background: var(--dbz-green);
      color: var(--night-black);
      }
      
      .btn-danger {
      background: var(--dbz-gradient-red);
      border: none;
      color: var(--night-white);
      box-shadow: var(--shadow-sm);
      }
      
      .btn-danger:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      background: var(--dbz-gradient-red);
      color: var(--night-white);
      }
      
      .btn-warning {
      background: var(--dbz-gradient-yellow);
      border: none;
      color: var(--night-black);
      box-shadow: var(--shadow-sm);
      }
      
      .btn-warning:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      background: var(--dbz-gradient-yellow);
      color: var(--night-black);
      }
      
      .btn-outline-primary {
      border: 2px solid var(--dbz-orange);
      color: var(--dbz-orange);
      background: transparent;
      }
      
      .btn-outline-primary:hover {
      background: var(--dbz-orange);
      color: var(--night-black);
      transform: translateY(-2px);
      box-shadow: var(--shadow-glow);
      }
      
      .btn-outline-secondary {
      border: 2px solid var(--dbz-blue);
      color: var(--dbz-blue);
      background: transparent;
      }
      
      .btn-outline-secondary:hover {
      background: var(--dbz-blue);
      color: var(--night-black);
      transform: translateY(-2px);
      box-shadow: 0 0 20px rgba(78, 205, 196, 0.5);
      }
      
      /* ===== Cards ===== */
      .card {
      background: var(--night-dark);
      border: 1px solid var(--night-gray);
      border-radius: 12px;
      transition: var(--transition-normal);
      overflow: hidden;
      }
      
      .card:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-lg);
      border-color: var(--dbz-orange);
      }
      
      .card-header {
      background: var(--night-gray);
      border-bottom: 1px solid var(--night-light);
      padding: 1rem 1.5rem;
      }
      
      .card-body {
      padding: 1.5rem;
      }
      
      .card-footer {
      background: var(--night-gray);
      border-top: 1px solid var(--night-light);
      padding: 1rem 1.5rem;
      }
      
      /* ===== Hover Effects ===== */
      .hover-lift {
      transition: var(--transition-normal);
      }
      
      .hover-lift:hover {
      transform: translateY(-5px);
      box-shadow: var(--shadow-lg);
      }
      
      /* ===== Navigation ===== */
      .navbar {
      background: var(--night-dark);
      border-bottom: 1px solid var(--night-gray);
      }
      
      .navbar-brand {
      font-weight: 700;
      color: var(--dbz-orange) !important;
      text-shadow: 0 0 10px rgba(255, 107, 53, 0.5);
      }
      
      .navbar-brand:hover {
      color: var(--dbz-orange) !important;
      text-shadow: 0 0 15px rgba(255, 107, 53, 0.8);
      }
      
      .navbar-nav .nav-link {
      color: var(--night-white) !important;
      font-weight: 500;
      position: relative;
      transition: var(--transition-normal);
      }
      
      .navbar-nav .nav-link::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 50%;
      width: 0;
      height: 2px;
      background: var(--dbz-orange);
      transition: var(--transition-normal);
      transform: translateX(-50%);
      }
      
      .navbar-nav .nav-link:hover::after,
      .navbar-nav .nav-link.active::after {
      width: 100%;
      }
      
      .navbar-nav .nav-link:hover {
      color: var(--dbz-orange) !important;
      }
      
      /* ===== Forms ===== */
      .form-control {
      background: var(--night-gray);
      border: 1px solid var(--night-light);
      color: var(--night-white);
      border-radius: 8px;
      transition: var(--transition-normal);
      }
      
      .form-control:focus {
      background: var(--night-gray);
      border-color: var(--dbz-orange);
      color: var(--night-white);
      box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
      }
      
      .form-label {
      color: var(--night-white);
      font-weight: 500;
      margin-bottom: 0.5rem;
      }
      
      .form-select {
      background: var(--night-gray);
      border: 1px solid var(--night-light);
      color: var(--night-white);
      border-radius: 8px;
      }
      
      .form-select:focus {
      background: var(--night-gray);
      border-color: var(--dbz-orange);
      color: var(--night-white);
      box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
      }
      
      /* ===== Alerts ===== */
      .alert {
      border: none;
      border-radius: 12px;
      padding: 1rem 1.5rem;
      margin-bottom: 1rem;
      }
      
      .alert-primary {
      background: rgba(255, 107, 53, 0.1);
      color: var(--dbz-orange);
      border-left: 4px solid var(--dbz-orange);
      }
      
      .alert-secondary {
      background: rgba(78, 205, 196, 0.1);
      color: var(--dbz-blue);
      border-left: 4px solid var(--dbz-blue);
      }
      
      .alert-success {
      background: rgba(46, 213, 115, 0.1);
      color: var(--dbz-green);
      border-left: 4px solid var(--dbz-green);
      }
      
      .alert-danger {
      background: rgba(255, 71, 87, 0.1);
      color: var(--dbz-red);
      border-left: 4px solid var(--dbz-red);
      }
      
      .alert-warning {
      background: rgba(255, 230, 109, 0.1);
      color: var(--dbz-yellow);
      border-left: 4px solid var(--dbz-yellow);
      }
      
      /* ===== Badges ===== */
      .badge {
      font-weight: 500;
      padding: 0.5em 0.75em;
      border-radius: 6px;
      }
      
      .badge-primary {
      background: var(--dbz-orange);
      color: var(--night-black);
      }
      
      .badge-secondary {
      background: var(--dbz-blue);
      color: var(--night-black);
      }
      
      .badge-success {
      background: var(--dbz-green);
      color: var(--night-black);
      }
      
      .badge-danger {
      background: var(--dbz-red);
      color: var(--night-white);
      }
      
      .badge-warning {
      background: var(--dbz-yellow);
      color: var(--night-black);
      }
      
      /* ===== Tables ===== */
      .table {
      background: var(--night-dark);
      border-radius: 12px;
      overflow: hidden;
      border: 1px solid var(--night-gray);
      }
      
      .table thead th {
      background: var(--night-gray);
      color: var(--night-white);
      border-bottom: 2px solid var(--dbz-orange);
      font-weight: 600;
      }
      
      .table tbody tr {
      color: var(--night-white);
      }
      
      .table tbody tr:hover {
      background: rgba(255, 107, 53, 0.1);
      }
      
      .table td, .table th {
      border-color: var(--night-light);
      padding: 1rem;
      }
      
      /* ===== Modals ===== */
      .modal-content {
      background: var(--night-dark);
      border: 1px solid var(--night-gray);
      border-radius: 12px;
      }
      
      .modal-header {
      border-bottom: 1px solid var(--night-light);
      }
      
      .modal-title {
      color: var(--dbz-orange);
      font-weight: 600;
      }
      
      .modal-body {
      color: var(--night-white);
      }
      
      .modal-footer {
      border-top: 1px solid var(--night-light);
      }
      
      /* ===== Progress Bars ===== */
      .progress {
      background: var(--night-gray);
      border-radius: 8px;
      height: 8px;
      }
      
      .progress-bar {
      background: var(--dbz-gradient-orange);
      border-radius: 8px;
      }
      
      .progress-bar-striped {
      background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
      background-size: 1rem 1rem;
      }
      
      /* ===== Dropdowns ===== */
      .dropdown-menu {
      background: var(--night-dark);
      border: 1px solid var(--night-gray);
      border-radius: 8px;
      box-shadow: var(--shadow-lg);
      }
      
      .dropdown-item {
      color: var(--night-white);
      transition: var(--transition-fast);
      }
      
      .dropdown-item:hover {
      background: rgba(255, 107, 53, 0.1);
      color: var(--dbz-orange);
      }
      
      .dropdown-divider {
      border-color: var(--night-light);
      }
      
      /* ===== Pagination ===== */
      .page-link {
      background: var(--night-gray);
      border: 1px solid var(--night-light);
      color: var(--night-white);
      transition: var(--transition-normal);
      }
      
      .page-link:hover {
      background: var(--dbz-orange);
      border-color: var(--dbz-orange);
      color: var(--night-black);
      }
      
      .page-item.active .page-link {
      background: var(--dbz-orange);
      border-color: var(--dbz-orange);
      color: var(--night-black);
      }
      
      /* ===== List Groups ===== */
      .list-group-item {
      background: var(--night-dark);
      border: 1px solid var(--night-light);
      color: var(--night-white);
      transition: var(--transition-normal);
      }
      
      .list-group-item:hover {
      background: rgba(255, 107, 53, 0.1);
      border-color: var(--dbz-orange);
      }
      
      .list-group-item.active {
      background: var(--dbz-orange);
      border-color: var(--dbz-orange);
      color: var(--night-black);
      }
      
      /* ===== Breadcrumbs ===== */
      .breadcrumb {
      background: var(--night-gray);
      border-radius: 8px;
      padding: 0.75rem 1rem;
      }
      
      .breadcrumb-item + .breadcrumb-item::before {
      color: var(--night-light);
      }
      
      .breadcrumb-item.active {
      color: var(--dbz-orange);
      }
      
      /* ===== Spinners ===== */
      .spinner-border {
      color: var(--dbz-orange);
      }
      
      .spinner-grow {
      color: var(--dbz-orange);
      }
      
      /* ===== Animations ===== */
      @keyframes dbz-pulse {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.05); }
      }
      
      @keyframes dbz-glow {
      0%, 100% { box-shadow: 0 0 5px rgba(255, 107, 53, 0.5); }
      50% { box-shadow: 0 0 20px rgba(255, 107, 53, 0.8); }
      }
      
      .dbz-pulse {
      animation: dbz-pulse 2s infinite;
      }
      
      .dbz-glow {
      animation: dbz-glow 2s infinite;
      }
      
      .border-dbz {
      border-color: var(--dbz-orange) !important;
      }
      
      .shadow-dbz {
      box-shadow: var(--shadow-glow);
      }
      
      .text-glow {
      text-shadow: 0 0 10px rgba(255, 107, 53, 0.8);
      }
      
      .bg-gradient-dbz {
      background: var(--dbz-gradient-orange);
      }
      
      /* ===== Topbar Links ===== */
      .topbar-link {
      transition: var(--transition-normal);
      }
      
      .topbar-link:hover, .topbar-link:focus {
      transform: translateY(-3px);
      box-shadow: var(--shadow-lg);
      text-decoration: none;
      }
      
      .topbar-link .bi {
      transition: var(--transition-normal);
      }
      
      .topbar-link:hover .bi, .topbar-link:focus .bi {
      transform: scale(1.1);
      }
      
      /* ===== Responsive Design ===== */
      @media (max-width: 768px) {
      .btn {
      font-size: 0.875rem;
      padding: 0.5rem 1rem;
      }
      
      .card {
      margin-bottom: 1rem;
      }
      
      .navbar-brand {
      font-size: 1.25rem;
      }
      }
      
      /* ===== Print Styles ===== */
      @media print {
      .no-print {
      display: none !important;
      }
      
      body {
      background: white !important;
      color: black !important;
      }
      
      .card {
      border: 1px solid #ccc !important;
      background: white !important;
      }
      }