diff --git a/src/admin/pages/WarehouseCategories.tsx b/src/admin/pages/WarehouseCategories.tsx
new file mode 100644
index 0000000..ffde9d7
--- /dev/null
+++ b/src/admin/pages/WarehouseCategories.tsx
@@ -0,0 +1,395 @@
+import { useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useAlert } from "../context/AlertContext";
+import { useAuth } from "../context/AuthContext";
+import Forbidden from "../components/Forbidden";
+import { motion, AnimatePresence } from "framer-motion";
+import ConfirmModal from "../components/ConfirmModal";
+import useModalLock from "../hooks/useModalLock";
+
+import apiFetch from "../utils/api";
+import FormField from "../components/FormField";
+import {
+  warehouseCategoryListOptions,
+  type WarehouseCategory,
+} from "../lib/queries/warehouse";
+
+const API_BASE = "/api/admin/warehouse/categories";
+
+interface CategoryForm {
+  name: string;
+  description: string;
+  sort_order: number;
+}
+
+export default function WarehouseCategories() {
+  const alert = useAlert();
+  const { hasPermission } = useAuth();
+  const queryClient = useQueryClient();
+
+  const { data: categories = [], isPending } = useQuery(
+    warehouseCategoryListOptions(),
+  );
+
+  const [showModal, setShowModal] = useState(false);
+  const [editingCategory, setEditingCategory] =
+    useState<WarehouseCategory | null>(null);
+  const [form, setForm] = useState<CategoryForm>({
+    name: "",
+    description: "",
+    sort_order: 0,
+  });
+
+  const [errors, setErrors] = useState<Record<string, string>>({});
+  const [deleteConfirm, setDeleteConfirm] = useState<{
+    show: boolean;
+    category: WarehouseCategory | null;
+  }>({ show: false, category: null });
+
+  useModalLock(showModal);
+
+  if (!hasPermission("warehouse.manage")) return <Forbidden />;
+
+  const openCreateModal = () => {
+    setEditingCategory(null);
+    setForm({
+      name: "",
+      description: "",
+      sort_order: 0,
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const openEditModal = (category: WarehouseCategory) => {
+    setEditingCategory(category);
+    setForm({
+      name: category.name,
+      description: category.description || "",
+      sort_order: category.sort_order,
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const handleSubmit = async () => {
+    const newErrors: Record<string, string> = {};
+    if (!form.name.trim()) newErrors.name = "Zadejte název kategorie";
+    setErrors(newErrors);
+    if (Object.keys(newErrors).length > 0) return;
+
+    try {
+      const url = editingCategory
+        ? `${API_BASE}/${editingCategory.id}`
+        : API_BASE;
+      const method = editingCategory ? "PUT" : "POST";
+
+      const response = await apiFetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(form),
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        setShowModal(false);
+        queryClient.invalidateQueries({
+          queryKey: ["warehouse", "categories"],
+        });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  const handleDelete = async () => {
+    if (!deleteConfirm.category) return;
+
+    try {
+      const response = await apiFetch(
+        `${API_BASE}/${deleteConfirm.category.id}`,
+        {
+          method: "DELETE",
+        },
+      );
+
+      const result = await response.json();
+
+      if (result.success) {
+        setDeleteConfirm({ show: false, category: null });
+        queryClient.invalidateQueries({
+          queryKey: ["warehouse", "categories"],
+        });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  if (isPending) {
+    return (
+      <div className="admin-loading">
+        <div className="admin-spinner" />
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <motion.div
+        className="admin-page-header"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25 }}
+      >
+        <div>
+          <h1 className="admin-page-title">Kategorie skladu</h1>
+        </div>
+        <div className="admin-page-actions">
+          <button
+            onClick={openCreateModal}
+            className="admin-btn admin-btn-primary"
+          >
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+            >
+              <line x1="12" y1="5" x2="12" y2="19" />
+              <line x1="5" y1="12" x2="19" y2="12" />
+            </svg>
+            Přidat kategorii
+          </button>
+        </div>
+      </motion.div>
+
+      <motion.div
+        className="admin-card"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25, delay: 0.06 }}
+      >
+        <div className="admin-card-body">
+          {categories.length === 0 && (
+            <div className="admin-empty-state">
+              <div className="admin-empty-icon">
+                <svg
+                  width="28"
+                  height="28"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
+                </svg>
+              </div>
+              <p>Zatím nejsou žádné kategorie.</p>
+              <button
+                onClick={openCreateModal}
+                className="admin-btn admin-btn-primary"
+              >
+                Přidat první kategorii
+              </button>
+            </div>
+          )}
+          {categories.length > 0 && (
+            <div className="admin-table-responsive">
+              <table className="admin-table">
+                <thead>
+                  <tr>
+                    <th>Název</th>
+                    <th>Popis</th>
+                    <th>Pořadí</th>
+                    <th>Akce</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {categories.map((category) => (
+                    <tr key={category.id}>
+                      <td className="fw-500">{category.name}</td>
+                      <td>{category.description || "—"}</td>
+                      <td className="admin-mono">{category.sort_order}</td>
+                      <td>
+                        <div className="admin-table-actions">
+                          <button
+                            onClick={() => openEditModal(category)}
+                            className="admin-btn-icon"
+                            title="Upravit"
+                            aria-label="Upravit"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" />
+                              <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" />
+                            </svg>
+                          </button>
+                          <button
+                            onClick={() =>
+                              setDeleteConfirm({ show: true, category })
+                            }
+                            className="admin-btn-icon danger"
+                            title="Smazat"
+                            aria-label="Smazat"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <polyline points="3 6 5 6 21 6" />
+                              <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" />
+                            </svg>
+                          </button>
+                        </div>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </div>
+      </motion.div>
+
+      {/* Add/Edit Modal */}
+      <AnimatePresence>
+        {showModal && (
+          <motion.div
+            className="admin-modal-overlay"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={{ duration: 0.2 }}
+          >
+            <div
+              className="admin-modal-backdrop"
+              onClick={() => setShowModal(false)}
+            />
+            <motion.div
+              className="admin-modal"
+              initial={{ opacity: 0, scale: 0.95, y: 20 }}
+              animate={{ opacity: 1, scale: 1, y: 0 }}
+              exit={{ opacity: 0, scale: 0.95, y: 20 }}
+              transition={{ duration: 0.2 }}
+            >
+              <div className="admin-modal-header">
+                <h2 className="admin-modal-title">
+                  {editingCategory ? "Upravit kategorii" : "Přidat kategorii"}
+                </h2>
+              </div>
+
+              <div className="admin-modal-body">
+                <div className="admin-form">
+                  <FormField label="Název" error={errors.name} required>
+                    <input
+                      type="text"
+                      value={form.name}
+                      onChange={(e) => {
+                        setForm({ ...form, name: e.target.value });
+                        setErrors((prev) => ({ ...prev, name: "" }));
+                      }}
+                      className="admin-form-input"
+                      placeholder="Název kategorie"
+                      aria-invalid={!!errors.name}
+                    />
+                  </FormField>
+
+                  <FormField label="Popis">
+                    <textarea
+                      value={form.description}
+                      onChange={(e) =>
+                        setForm({ ...form, description: e.target.value })
+                      }
+                      className="admin-form-input"
+                      rows={3}
+                      placeholder="Volitelný popis kategorie"
+                    />
+                  </FormField>
+
+                  <FormField label="Pořadí řazení">
+                    <input
+                      type="number"
+                      inputMode="numeric"
+                      value={form.sort_order}
+                      onChange={(e) =>
+                        setForm({
+                          ...form,
+                          sort_order: parseInt(e.target.value) || 0,
+                        })
+                      }
+                      className="admin-form-input"
+                      min="0"
+                    />
+                    <small className="admin-form-hint">
+                      Nižší hodnota = výše v seznamu
+                    </small>
+                  </FormField>
+                </div>
+              </div>
+
+              <div className="admin-modal-footer">
+                <button
+                  type="button"
+                  onClick={() => setShowModal(false)}
+                  className="admin-btn admin-btn-secondary"
+                >
+                  Zrušit
+                </button>
+                <button
+                  type="button"
+                  onClick={handleSubmit}
+                  className="admin-btn admin-btn-primary"
+                >
+                  Uložit
+                </button>
+              </div>
+            </motion.div>
+          </motion.div>
+        )}
+      </AnimatePresence>
+
+      {/* Delete Confirmation */}
+      <ConfirmModal
+        isOpen={deleteConfirm.show}
+        onClose={() => setDeleteConfirm({ show: false, category: null })}
+        onConfirm={handleDelete}
+        title="Smazat kategorii"
+        message={
+          deleteConfirm.category
+            ? `Opravdu chcete smazat kategorii "${deleteConfirm.category.name}"?`
+            : ""
+        }
+        confirmText="Smazat"
+        confirmVariant="danger"
+      />
+    </div>
+  );
+}
diff --git a/src/admin/pages/WarehouseLocations.tsx b/src/admin/pages/WarehouseLocations.tsx
new file mode 100644
index 0000000..fdb7ba3
--- /dev/null
+++ b/src/admin/pages/WarehouseLocations.tsx
@@ -0,0 +1,442 @@
+import { useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useAlert } from "../context/AlertContext";
+import { useAuth } from "../context/AuthContext";
+import Forbidden from "../components/Forbidden";
+import { motion, AnimatePresence } from "framer-motion";
+import ConfirmModal from "../components/ConfirmModal";
+import useModalLock from "../hooks/useModalLock";
+
+import apiFetch from "../utils/api";
+import FormField from "../components/FormField";
+import {
+  warehouseLocationListOptions,
+  type WarehouseLocation,
+} from "../lib/queries/warehouse";
+
+const API_BASE = "/api/admin/warehouse/locations";
+
+interface LocationForm {
+  code: string;
+  name: string;
+  description: string;
+}
+
+export default function WarehouseLocations() {
+  const alert = useAlert();
+  const { hasPermission } = useAuth();
+  const queryClient = useQueryClient();
+
+  const { data: locations = [], isPending } = useQuery(
+    warehouseLocationListOptions(),
+  );
+
+  const [showModal, setShowModal] = useState(false);
+  const [editingLocation, setEditingLocation] =
+    useState<WarehouseLocation | null>(null);
+  const [form, setForm] = useState<LocationForm>({
+    code: "",
+    name: "",
+    description: "",
+  });
+
+  const [errors, setErrors] = useState<Record<string, string>>({});
+  const [deleteConfirm, setDeleteConfirm] = useState<{
+    show: boolean;
+    location: WarehouseLocation | null;
+  }>({ show: false, location: null });
+
+  useModalLock(showModal);
+
+  if (!hasPermission("warehouse.manage")) return <Forbidden />;
+
+  const openCreateModal = () => {
+    setEditingLocation(null);
+    setForm({
+      code: "",
+      name: "",
+      description: "",
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const openEditModal = (location: WarehouseLocation) => {
+    setEditingLocation(location);
+    setForm({
+      code: location.code,
+      name: location.name,
+      description: location.description || "",
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const handleSubmit = async () => {
+    const newErrors: Record<string, string> = {};
+    if (!form.code.trim()) newErrors.code = "Zadejte kód umístění";
+    if (!form.name.trim()) newErrors.name = "Zadejte název umístění";
+    setErrors(newErrors);
+    if (Object.keys(newErrors).length > 0) return;
+
+    try {
+      const url = editingLocation
+        ? `${API_BASE}/${editingLocation.id}`
+        : API_BASE;
+      const method = editingLocation ? "PUT" : "POST";
+
+      const response = await apiFetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(form),
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        setShowModal(false);
+        queryClient.invalidateQueries({ queryKey: ["warehouse", "locations"] });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  const handleDelete = async () => {
+    if (!deleteConfirm.location) return;
+
+    try {
+      const response = await apiFetch(
+        `${API_BASE}/${deleteConfirm.location.id}`,
+        {
+          method: "DELETE",
+        },
+      );
+
+      const result = await response.json();
+
+      if (result.success) {
+        setDeleteConfirm({ show: false, location: null });
+        queryClient.invalidateQueries({ queryKey: ["warehouse", "locations"] });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  const toggleActive = async (location: WarehouseLocation) => {
+    try {
+      const response = await apiFetch(`${API_BASE}/${location.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ is_active: !location.is_active }),
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        queryClient.invalidateQueries({ queryKey: ["warehouse", "locations"] });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(
+          location.is_active
+            ? "Umístění bylo deaktivováno"
+            : "Umístění bylo aktivováno",
+        );
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  if (isPending) {
+    return (
+      <div className="admin-loading">
+        <div className="admin-spinner" />
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <motion.div
+        className="admin-page-header"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25 }}
+      >
+        <div>
+          <h1 className="admin-page-title">Umístění skladu</h1>
+        </div>
+        <div className="admin-page-actions">
+          <button
+            onClick={openCreateModal}
+            className="admin-btn admin-btn-primary"
+          >
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+            >
+              <line x1="12" y1="5" x2="12" y2="19" />
+              <line x1="5" y1="12" x2="19" y2="12" />
+            </svg>
+            Přidat umístění
+          </button>
+        </div>
+      </motion.div>
+
+      <motion.div
+        className="admin-card"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25, delay: 0.06 }}
+      >
+        <div className="admin-card-body">
+          {locations.length === 0 && (
+            <div className="admin-empty-state">
+              <div className="admin-empty-icon">
+                <svg
+                  width="28"
+                  height="28"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z" />
+                  <circle cx="12" cy="10" r="3" />
+                </svg>
+              </div>
+              <p>Zatím nejsou žádná umístění.</p>
+              <button
+                onClick={openCreateModal}
+                className="admin-btn admin-btn-primary"
+              >
+                Přidat první umístění
+              </button>
+            </div>
+          )}
+          {locations.length > 0 && (
+            <div className="admin-table-responsive">
+              <table className="admin-table">
+                <thead>
+                  <tr>
+                    <th>Kód</th>
+                    <th>Název</th>
+                    <th>Popis</th>
+                    <th>Stav</th>
+                    <th>Akce</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {locations.map((location) => (
+                    <tr
+                      key={location.id}
+                      className={
+                        !location.is_active ? "admin-table-row-inactive" : ""
+                      }
+                    >
+                      <td className="admin-mono fw-500">{location.code}</td>
+                      <td>{location.name}</td>
+                      <td>{location.description || "—"}</td>
+                      <td>
+                        <button
+                          onClick={() => toggleActive(location)}
+                          className={`admin-badge ${location.is_active ? "admin-badge-active" : "admin-badge-inactive"}`}
+                        >
+                          {location.is_active ? "Aktivní" : "Neaktivní"}
+                        </button>
+                      </td>
+                      <td>
+                        <div className="admin-table-actions">
+                          <button
+                            onClick={() => openEditModal(location)}
+                            className="admin-btn-icon"
+                            title="Upravit"
+                            aria-label="Upravit"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" />
+                              <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" />
+                            </svg>
+                          </button>
+                          <button
+                            onClick={() =>
+                              setDeleteConfirm({ show: true, location })
+                            }
+                            className="admin-btn-icon danger"
+                            title="Smazat"
+                            aria-label="Smazat"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <polyline points="3 6 5 6 21 6" />
+                              <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" />
+                            </svg>
+                          </button>
+                        </div>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </div>
+      </motion.div>
+
+      {/* Add/Edit Modal */}
+      <AnimatePresence>
+        {showModal && (
+          <motion.div
+            className="admin-modal-overlay"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={{ duration: 0.2 }}
+          >
+            <div
+              className="admin-modal-backdrop"
+              onClick={() => setShowModal(false)}
+            />
+            <motion.div
+              className="admin-modal"
+              initial={{ opacity: 0, scale: 0.95, y: 20 }}
+              animate={{ opacity: 1, scale: 1, y: 0 }}
+              exit={{ opacity: 0, scale: 0.95, y: 20 }}
+              transition={{ duration: 0.2 }}
+            >
+              <div className="admin-modal-header">
+                <h2 className="admin-modal-title">
+                  {editingLocation ? "Upravit umístění" : "Přidat umístění"}
+                </h2>
+              </div>
+
+              <div className="admin-modal-body">
+                <div className="admin-form">
+                  <div className="admin-form-row">
+                    <FormField label="Kód" error={errors.code} required>
+                      <input
+                        type="text"
+                        value={form.code}
+                        onChange={(e) => {
+                          setForm({
+                            ...form,
+                            code: e.target.value.toUpperCase(),
+                          });
+                          setErrors((prev) => ({
+                            ...prev,
+                            code: "",
+                          }));
+                        }}
+                        className="admin-form-input"
+                        placeholder="A-01"
+                        aria-invalid={!!errors.code}
+                      />
+                    </FormField>
+
+                    <FormField label="Název" error={errors.name} required>
+                      <input
+                        type="text"
+                        value={form.name}
+                        onChange={(e) => {
+                          setForm({ ...form, name: e.target.value });
+                          setErrors((prev) => ({
+                            ...prev,
+                            name: "",
+                          }));
+                        }}
+                        className="admin-form-input"
+                        placeholder="Regál A, polička 1"
+                        aria-invalid={!!errors.name}
+                      />
+                    </FormField>
+                  </div>
+
+                  <FormField label="Popis">
+                    <textarea
+                      value={form.description}
+                      onChange={(e) =>
+                        setForm({
+                          ...form,
+                          description: e.target.value,
+                        })
+                      }
+                      className="admin-form-input"
+                      rows={3}
+                      placeholder="Volitelný popis umístění"
+                    />
+                  </FormField>
+                </div>
+              </div>
+
+              <div className="admin-modal-footer">
+                <button
+                  type="button"
+                  onClick={() => setShowModal(false)}
+                  className="admin-btn admin-btn-secondary"
+                >
+                  Zrušit
+                </button>
+                <button
+                  type="button"
+                  onClick={handleSubmit}
+                  className="admin-btn admin-btn-primary"
+                >
+                  Uložit
+                </button>
+              </div>
+            </motion.div>
+          </motion.div>
+        )}
+      </AnimatePresence>
+
+      {/* Delete Confirmation */}
+      <ConfirmModal
+        isOpen={deleteConfirm.show}
+        onClose={() => setDeleteConfirm({ show: false, location: null })}
+        onConfirm={handleDelete}
+        title="Smazat umístění"
+        message={
+          deleteConfirm.location
+            ? `Opravdu chcete smazat umístění "${deleteConfirm.location.code} - ${deleteConfirm.location.name}"? Pokud umístění obsahuje zásoby, nelze jej smazat.`
+            : ""
+        }
+        confirmText="Smazat"
+        confirmVariant="danger"
+      />
+    </div>
+  );
+}
diff --git a/src/admin/pages/WarehouseSuppliers.tsx b/src/admin/pages/WarehouseSuppliers.tsx
new file mode 100644
index 0000000..6ca2a67
--- /dev/null
+++ b/src/admin/pages/WarehouseSuppliers.tsx
@@ -0,0 +1,592 @@
+import { useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useAlert } from "../context/AlertContext";
+import { useAuth } from "../context/AuthContext";
+import Forbidden from "../components/Forbidden";
+import { motion, AnimatePresence } from "framer-motion";
+import ConfirmModal from "../components/ConfirmModal";
+import Pagination from "../components/Pagination";
+import useModalLock from "../hooks/useModalLock";
+import useDebounce from "../hooks/useDebounce";
+
+import apiFetch from "../utils/api";
+import FormField from "../components/FormField";
+import {
+  warehouseSupplierListOptions,
+  type WarehouseSupplier,
+} from "../lib/queries/warehouse";
+
+const API_BASE = "/api/admin/warehouse/suppliers";
+
+interface SupplierForm {
+  name: string;
+  ico: string;
+  dic: string;
+  contact_person: string;
+  email: string;
+  phone: string;
+  address: string;
+  notes: string;
+}
+
+const PER_PAGE = 20;
+
+export default function WarehouseSuppliers() {
+  const alert = useAlert();
+  const { hasPermission } = useAuth();
+  const queryClient = useQueryClient();
+
+  const [page, setPage] = useState(1);
+  const [search, setSearch] = useState("");
+  const debouncedSearch = useDebounce(search, 300);
+
+  const { data: suppliersData, isPending } = useQuery(
+    warehouseSupplierListOptions({
+      search: debouncedSearch || undefined,
+      page,
+      perPage: PER_PAGE,
+    }),
+  );
+
+  const suppliers = suppliersData?.data ?? [];
+  const pagination = suppliersData?.pagination ?? null;
+
+  const [showModal, setShowModal] = useState(false);
+  const [editingSupplier, setEditingSupplier] =
+    useState<WarehouseSupplier | null>(null);
+  const [form, setForm] = useState<SupplierForm>({
+    name: "",
+    ico: "",
+    dic: "",
+    contact_person: "",
+    email: "",
+    phone: "",
+    address: "",
+    notes: "",
+  });
+
+  const [errors, setErrors] = useState<Record<string, string>>({});
+  const [deactivateConfirm, setDeactivateConfirm] = useState<{
+    show: boolean;
+    supplier: WarehouseSupplier | null;
+  }>({ show: false, supplier: null });
+
+  useModalLock(showModal);
+
+  if (!hasPermission("warehouse.manage")) return <Forbidden />;
+
+  const openCreateModal = () => {
+    setEditingSupplier(null);
+    setForm({
+      name: "",
+      ico: "",
+      dic: "",
+      contact_person: "",
+      email: "",
+      phone: "",
+      address: "",
+      notes: "",
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const openEditModal = (supplier: WarehouseSupplier) => {
+    setEditingSupplier(supplier);
+    setForm({
+      name: supplier.name,
+      ico: supplier.ico || "",
+      dic: supplier.dic || "",
+      contact_person: supplier.contact_person || "",
+      email: supplier.email || "",
+      phone: supplier.phone || "",
+      address: supplier.address || "",
+      notes: supplier.notes || "",
+    });
+    setErrors({});
+    setShowModal(true);
+  };
+
+  const handleSubmit = async () => {
+    const newErrors: Record<string, string> = {};
+    if (!form.name.trim()) newErrors.name = "Zadejte název dodavatele";
+    setErrors(newErrors);
+    if (Object.keys(newErrors).length > 0) return;
+
+    try {
+      const url = editingSupplier
+        ? `${API_BASE}/${editingSupplier.id}`
+        : API_BASE;
+      const method = editingSupplier ? "PUT" : "POST";
+
+      const response = await apiFetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(form),
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        setShowModal(false);
+        queryClient.invalidateQueries({
+          queryKey: ["warehouse", "suppliers"],
+        });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  const handleDeactivate = async () => {
+    if (!deactivateConfirm.supplier) return;
+
+    try {
+      const response = await apiFetch(
+        `${API_BASE}/${deactivateConfirm.supplier.id}`,
+        {
+          method: "DELETE",
+        },
+      );
+
+      const result = await response.json();
+
+      if (result.success) {
+        setDeactivateConfirm({ show: false, supplier: null });
+        queryClient.invalidateQueries({
+          queryKey: ["warehouse", "suppliers"],
+        });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(result.message);
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  const toggleActive = async (supplier: WarehouseSupplier) => {
+    try {
+      const response = await apiFetch(`${API_BASE}/${supplier.id}`, {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ is_active: !supplier.is_active }),
+      });
+
+      const result = await response.json();
+
+      if (result.success) {
+        queryClient.invalidateQueries({
+          queryKey: ["warehouse", "suppliers"],
+        });
+        queryClient.invalidateQueries({ queryKey: ["warehouse"] });
+        alert.success(
+          supplier.is_active
+            ? "Dodavatel byl deaktivován"
+            : "Dodavatel byl aktivován",
+        );
+      } else {
+        alert.error(result.error);
+      }
+    } catch {
+      alert.error("Chyba připojení");
+    }
+  };
+
+  if (isPending) {
+    return (
+      <div className="admin-loading">
+        <div className="admin-spinner" />
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <motion.div
+        className="admin-page-header"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25 }}
+      >
+        <div>
+          <h1 className="admin-page-title">Dodavatelé</h1>
+        </div>
+        <div className="admin-page-actions">
+          <div className="admin-search">
+            <svg
+              width="16"
+              height="16"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+            >
+              <circle cx="11" cy="11" r="8" />
+              <line x1="21" y1="21" x2="16.65" y2="16.65" />
+            </svg>
+            <input
+              type="text"
+              value={search}
+              onChange={(e) => {
+                setSearch(e.target.value);
+                setPage(1);
+              }}
+              placeholder="Hledat dodavatele..."
+              className="admin-form-input"
+            />
+          </div>
+          <button
+            onClick={openCreateModal}
+            className="admin-btn admin-btn-primary"
+          >
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+            >
+              <line x1="12" y1="5" x2="12" y2="19" />
+              <line x1="5" y1="12" x2="19" y2="12" />
+            </svg>
+            Přidat dodavatele
+          </button>
+        </div>
+      </motion.div>
+
+      <motion.div
+        className="admin-card"
+        initial={{ opacity: 0, y: 12 }}
+        animate={{ opacity: 1, y: 0 }}
+        transition={{ duration: 0.25, delay: 0.06 }}
+      >
+        <div className="admin-card-body">
+          {suppliers.length === 0 && !search && (
+            <div className="admin-empty-state">
+              <div className="admin-empty-icon">
+                <svg
+                  width="28"
+                  height="28"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
+                  <circle cx="9" cy="7" r="4" />
+                  <path d="M23 21v-2a4 4 0 0 0-3-3.87" />
+                  <path d="M16 3.13a4 4 0 0 1 0 7.75" />
+                </svg>
+              </div>
+              <p>Zatím nejsou žádní dodavatelé.</p>
+              <button
+                onClick={openCreateModal}
+                className="admin-btn admin-btn-primary"
+              >
+                Přidat prvního dodavatele
+              </button>
+            </div>
+          )}
+          {suppliers.length === 0 && search && (
+            <div className="admin-empty-state">
+              <p>Žádní dodavatelé pro &quot;{search}&quot;.</p>
+            </div>
+          )}
+          {suppliers.length > 0 && (
+            <div className="admin-table-responsive">
+              <table className="admin-table">
+                <thead>
+                  <tr>
+                    <th>Název</th>
+                    <th>IČO</th>
+                    <th>DIČ</th>
+                    <th>Kontaktní osoba</th>
+                    <th>E-mail</th>
+                    <th>Telefon</th>
+                    <th>Stav</th>
+                    <th>Akce</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {suppliers.map((supplier) => (
+                    <tr
+                      key={supplier.id}
+                      className={
+                        !supplier.is_active ? "admin-table-row-inactive" : ""
+                      }
+                    >
+                      <td className="fw-500">{supplier.name}</td>
+                      <td className="admin-mono">{supplier.ico || "—"}</td>
+                      <td className="admin-mono">{supplier.dic || "—"}</td>
+                      <td>{supplier.contact_person || "—"}</td>
+                      <td>{supplier.email || "—"}</td>
+                      <td className="admin-mono">{supplier.phone || "—"}</td>
+                      <td>
+                        <button
+                          onClick={() => toggleActive(supplier)}
+                          className={`admin-badge ${supplier.is_active ? "admin-badge-active" : "admin-badge-inactive"}`}
+                        >
+                          {supplier.is_active ? "Aktivní" : "Neaktivní"}
+                        </button>
+                      </td>
+                      <td>
+                        <div className="admin-table-actions">
+                          <button
+                            onClick={() => openEditModal(supplier)}
+                            className="admin-btn-icon"
+                            title="Upravit"
+                            aria-label="Upravit"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" />
+                              <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" />
+                            </svg>
+                          </button>
+                          <button
+                            onClick={() =>
+                              setDeactivateConfirm({
+                                show: true,
+                                supplier,
+                              })
+                            }
+                            className={`admin-btn-icon ${supplier.is_active ? "danger" : ""}`}
+                            title={
+                              supplier.is_active ? "Deaktivovat" : "Smazat"
+                            }
+                            aria-label={
+                              supplier.is_active ? "Deaktivovat" : "Smazat"
+                            }
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                              strokeLinecap="round"
+                              strokeLinejoin="round"
+                            >
+                              <polyline points="3 6 5 6 21 6" />
+                              <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" />
+                            </svg>
+                          </button>
+                        </div>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </div>
+      </motion.div>
+
+      {pagination && (
+        <Pagination pagination={pagination} onPageChange={setPage} />
+      )}
+
+      {/* Add/Edit Modal */}
+      <AnimatePresence>
+        {showModal && (
+          <motion.div
+            className="admin-modal-overlay"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={{ duration: 0.2 }}
+          >
+            <div
+              className="admin-modal-backdrop"
+              onClick={() => setShowModal(false)}
+            />
+            <motion.div
+              className="admin-modal"
+              initial={{ opacity: 0, scale: 0.95, y: 20 }}
+              animate={{ opacity: 1, scale: 1, y: 0 }}
+              exit={{ opacity: 0, scale: 0.95, y: 20 }}
+              transition={{ duration: 0.2 }}
+            >
+              <div className="admin-modal-header">
+                <h2 className="admin-modal-title">
+                  {editingSupplier ? "Upravit dodavatele" : "Přidat dodavatele"}
+                </h2>
+              </div>
+
+              <div className="admin-modal-body">
+                <div className="admin-form">
+                  <FormField label="Název" error={errors.name} required>
+                    <input
+                      type="text"
+                      value={form.name}
+                      onChange={(e) => {
+                        setForm({ ...form, name: e.target.value });
+                        setErrors((prev) => ({ ...prev, name: "" }));
+                      }}
+                      className="admin-form-input"
+                      placeholder="Název dodavatele"
+                      aria-invalid={!!errors.name}
+                    />
+                  </FormField>
+
+                  <div className="admin-form-row">
+                    <FormField label="IČO">
+                      <input
+                        type="text"
+                        value={form.ico}
+                        onChange={(e) =>
+                          setForm({ ...form, ico: e.target.value })
+                        }
+                        className="admin-form-input"
+                        placeholder="12345678"
+                      />
+                    </FormField>
+
+                    <FormField label="DIČ">
+                      <input
+                        type="text"
+                        value={form.dic}
+                        onChange={(e) =>
+                          setForm({ ...form, dic: e.target.value })
+                        }
+                        className="admin-form-input"
+                        placeholder="CZ12345678"
+                      />
+                    </FormField>
+                  </div>
+
+                  <div className="admin-form-row">
+                    <FormField label="Kontaktní osoba">
+                      <input
+                        type="text"
+                        value={form.contact_person}
+                        onChange={(e) =>
+                          setForm({
+                            ...form,
+                            contact_person: e.target.value,
+                          })
+                        }
+                        className="admin-form-input"
+                        placeholder="Jan Novák"
+                      />
+                    </FormField>
+
+                    <FormField label="E-mail">
+                      <input
+                        type="email"
+                        value={form.email}
+                        onChange={(e) =>
+                          setForm({ ...form, email: e.target.value })
+                        }
+                        className="admin-form-input"
+                        placeholder="info@firma.cz"
+                      />
+                    </FormField>
+                  </div>
+
+                  <div className="admin-form-row">
+                    <FormField label="Telefon">
+                      <input
+                        type="tel"
+                        value={form.phone}
+                        onChange={(e) =>
+                          setForm({ ...form, phone: e.target.value })
+                        }
+                        className="admin-form-input"
+                        placeholder="+420 123 456 789"
+                      />
+                    </FormField>
+                  </div>
+
+                  <FormField label="Adresa">
+                    <textarea
+                      value={form.address}
+                      onChange={(e) =>
+                        setForm({ ...form, address: e.target.value })
+                      }
+                      className="admin-form-input"
+                      rows={3}
+                      placeholder="Ulice, město, PSČ"
+                    />
+                  </FormField>
+
+                  <FormField label="Poznámky">
+                    <textarea
+                      value={form.notes}
+                      onChange={(e) =>
+                        setForm({ ...form, notes: e.target.value })
+                      }
+                      className="admin-form-input"
+                      rows={3}
+                      placeholder="Volitelné poznámky"
+                    />
+                  </FormField>
+                </div>
+              </div>
+
+              <div className="admin-modal-footer">
+                <button
+                  type="button"
+                  onClick={() => setShowModal(false)}
+                  className="admin-btn admin-btn-secondary"
+                >
+                  Zrušit
+                </button>
+                <button
+                  type="button"
+                  onClick={handleSubmit}
+                  className="admin-btn admin-btn-primary"
+                >
+                  Uložit
+                </button>
+              </div>
+            </motion.div>
+          </motion.div>
+        )}
+      </AnimatePresence>
+
+      {/* Deactivate/Delete Confirmation */}
+      <ConfirmModal
+        isOpen={deactivateConfirm.show}
+        onClose={() => setDeactivateConfirm({ show: false, supplier: null })}
+        onConfirm={handleDeactivate}
+        title={
+          deactivateConfirm.supplier?.is_active
+            ? "Deaktivovat dodavatele"
+            : "Smazat dodavatele"
+        }
+        message={
+          deactivateConfirm.supplier
+            ? deactivateConfirm.supplier.is_active
+              ? `Opravdu chcete deaktivovat dodavatele "${deactivateConfirm.supplier.name}"?`
+              : `Opravdu chcete smazat dodavatele "${deactivateConfirm.supplier.name}"? Tato akce je nevratná.`
+            : ""
+        }
+        confirmText={
+          deactivateConfirm.supplier?.is_active ? "Deaktivovat" : "Smazat"
+        }
+        confirmVariant="danger"
+      />
+    </div>
+  );
+}