/* Skeuomorphic theme — Heavy texture, depth, and realism
   Colors come from CSS variables in themes.css; this file is structural only. */

/* Linen texture background via repeating CSS gradient */
[data-theme='skeuomorphic'] body {
  background-image:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.02) 0px, transparent 1px, transparent 3px),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.02) 0px, transparent 1px, transparent 3px);
}

/* Glossy button effect: white gradient overlay on top half */
[data-theme='skeuomorphic'] .btn {
  background-image: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0.12) 48%,
    rgba(0, 0, 0, 0.04) 52%, rgba(0, 0, 0, 0.08) 100%
  );
  border: 1px solid rgba(0, 0, 0, 0.25);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

[data-theme='skeuomorphic'] .btn:hover {
  background-image: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.18) 48%,
    rgba(0, 0, 0, 0.02) 52%, rgba(0, 0, 0, 0.06) 100%
  );
}

/* Inner shadow on cards — floating above surface */
[data-theme='skeuomorphic'] .card {
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}

/* Brushed metal navbar */
[data-theme='skeuomorphic'] .navbar {
  background: linear-gradient(to bottom, #5a5a5a 0%, #4a4a4a 40%, #3a3a3a 60%, #333 100%) !important;
  border-bottom: 1px solid #222;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-theme='skeuomorphic'] .navbar .nav-link {
  color: #e0e0e0 !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
}

[data-theme='skeuomorphic'] .navbar .nav-link:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
}

[data-theme='skeuomorphic'] .navbar-brand {
  color: #ffffff !important;
  font-weight: 700;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
}

/* Input fields with inset shadow — pressed-in look */
[data-theme='skeuomorphic'] .form-control,
[data-theme='skeuomorphic'] .form-select,
[data-theme='skeuomorphic'] input,
[data-theme='skeuomorphic'] textarea,
[data-theme='skeuomorphic'] select {
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 0 rgba(255, 255, 255, 0.5);
  border: 1px solid #b0a898;
}

/* Pronounced depth on tables */
[data-theme='skeuomorphic'] .table th {
  background: linear-gradient(to bottom, #666 0%, #555 50%, #4a4a4a 100%) !important;
  color: #e0e0e0 !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-theme='skeuomorphic'] .table {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  overflow: hidden;
}

/* Dropdown with depth */
[data-theme='skeuomorphic'] .dropdown-menu {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid #b0a898;
}