diff --git a/src/admin/components/OrderConfirmationModal.tsx b/src/admin/components/OrderConfirmationModal.tsx
index 204c148..92985e8 100644
--- a/src/admin/components/OrderConfirmationModal.tsx
+++ b/src/admin/components/OrderConfirmationModal.tsx
@@ -2,6 +2,8 @@ import { useState, useCallback } from "react";
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
 import IconButton from "@mui/material/IconButton";
+import useMediaQuery from "@mui/material/useMediaQuery";
+import { useTheme } from "@mui/material/styles";
 import { Modal, Button, TextField, Field } from "../ui";
 import { useAlert } from "../context/AlertContext";
 
@@ -38,6 +40,8 @@ export default function OrderConfirmationModal({
   applyVat,
 }: OrderConfirmationModalProps) {
   const alert = useAlert();
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
   const [step, setStep] = useState<"choose" | "edit">("choose");
   const [lang, setLang] = useState<string>("cs");
   const [applyVatState, setApplyVatState] = useState(applyVat);
@@ -193,116 +197,221 @@ export default function OrderConfirmationModal({
               Zpět
             </Button>
           </Box>
-          <Box sx={{ overflowX: "auto" }}>
-            <Box
-              component="table"
-              sx={{
-                width: "100%",
-                borderCollapse: "collapse",
-                "& th": {
-                  textAlign: "left",
-                  fontSize: ".7rem",
-                  textTransform: "uppercase",
-                  letterSpacing: ".05em",
-                  fontWeight: 700,
-                  color: "text.secondary",
-                  pb: 1,
-                },
-                "& td": { py: 0.5, pr: 1, verticalAlign: "middle" },
-              }}
-            >
-              <thead>
-                <tr>
-                  <th>Popis</th>
-                  <th>Mn.</th>
-                  <th>Jedn.</th>
-                  <th>Cena</th>
-                  <th>%DPH</th>
-                  <th style={{ width: "40px" }} />
-                </tr>
-              </thead>
-              <tbody>
-                {items.map((item, i) => (
-                  <tr key={i}>
-                    <td>
-                      <TextField
-                        value={item.description}
-                        onChange={(e) =>
-                          updateItem(i, "description", e.target.value)
-                        }
-                        sx={{ minWidth: 200 }}
-                      />
-                    </td>
-                    <td>
-                      <TextField
-                        type="number"
-                        value={item.quantity}
-                        onChange={(e) =>
-                          updateItem(i, "quantity", Number(e.target.value) || 0)
-                        }
-                        sx={{ width: 90 }}
-                        slotProps={{ htmlInput: { step: "0.001" } }}
-                      />
-                    </td>
-                    <td>
-                      <TextField
-                        value={item.unit}
-                        onChange={(e) => updateItem(i, "unit", e.target.value)}
-                        sx={{ width: 70 }}
-                      />
-                    </td>
-                    <td>
-                      <TextField
-                        type="number"
-                        value={item.unit_price}
-                        onChange={(e) =>
-                          updateItem(
-                            i,
-                            "unit_price",
-                            Number(e.target.value) || 0,
-                          )
-                        }
-                        sx={{ width: 110 }}
-                        slotProps={{ htmlInput: { step: "0.01" } }}
-                      />
-                    </td>
-                    <td>
-                      <TextField
-                        type="number"
-                        value={item.vat_rate}
-                        onChange={(e) =>
-                          updateItem(i, "vat_rate", Number(e.target.value) || 0)
-                        }
-                        sx={{ width: 80 }}
-                        slotProps={{ htmlInput: { step: "1" } }}
-                      />
-                    </td>
-                    <td>
-                      <IconButton
-                        size="small"
-                        color="error"
-                        onClick={() => removeItem(i)}
-                        title="Odstranit"
-                        aria-label="Odstranit"
+          {isMobile ? (
+            <Box sx={{ display: "flex", flexDirection: "column", gap: 1.5 }}>
+              {items.map((item, i) => (
+                <Box
+                  key={i}
+                  sx={{
+                    border: 1,
+                    borderColor: "divider",
+                    borderRadius: 2,
+                    p: 1.5,
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 1,
+                  }}
+                >
+                  <Box sx={{ display: "flex", alignItems: "center", gap: 1 }}>
+                    <Typography
+                      variant="caption"
+                      sx={{ color: "text.secondary", fontWeight: 700 }}
+                    >
+                      Položka {i + 1}
+                    </Typography>
+                    <Box sx={{ flex: 1 }} />
+                    <IconButton
+                      size="small"
+                      color="error"
+                      onClick={() => removeItem(i)}
+                      title="Odstranit"
+                      aria-label="Odstranit"
+                    >
+                      <svg
+                        width="16"
+                        height="16"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        strokeWidth="2"
                       >
-                        <svg
-                          width="16"
-                          height="16"
-                          viewBox="0 0 24 24"
-                          fill="none"
-                          stroke="currentColor"
-                          strokeWidth="2"
-                        >
-                          <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>
-                      </IconButton>
-                    </td>
-                  </tr>
-                ))}
-              </tbody>
+                        <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>
+                    </IconButton>
+                  </Box>
+                  <TextField
+                    label="Popis"
+                    value={item.description}
+                    onChange={(e) =>
+                      updateItem(i, "description", e.target.value)
+                    }
+                  />
+                  <Box
+                    sx={{
+                      display: "grid",
+                      gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
+                      gap: 1,
+                    }}
+                  >
+                    <TextField
+                      label="Množství"
+                      type="number"
+                      value={item.quantity}
+                      onChange={(e) =>
+                        updateItem(i, "quantity", Number(e.target.value) || 0)
+                      }
+                      slotProps={{ htmlInput: { step: "0.001" } }}
+                    />
+                    <TextField
+                      label="Jednotka"
+                      value={item.unit}
+                      onChange={(e) => updateItem(i, "unit", e.target.value)}
+                    />
+                    <TextField
+                      label="Cena"
+                      type="number"
+                      value={item.unit_price}
+                      onChange={(e) =>
+                        updateItem(i, "unit_price", Number(e.target.value) || 0)
+                      }
+                      slotProps={{ htmlInput: { step: "0.01" } }}
+                    />
+                    <TextField
+                      label="%DPH"
+                      type="number"
+                      value={item.vat_rate}
+                      onChange={(e) =>
+                        updateItem(i, "vat_rate", Number(e.target.value) || 0)
+                      }
+                      slotProps={{ htmlInput: { step: "1" } }}
+                    />
+                  </Box>
+                </Box>
+              ))}
             </Box>
-          </Box>
+          ) : (
+            <Box sx={{ overflowX: "auto" }}>
+              <Box
+                component="table"
+                sx={{
+                  width: "100%",
+                  borderCollapse: "collapse",
+                  "& th": {
+                    textAlign: "left",
+                    fontSize: ".7rem",
+                    textTransform: "uppercase",
+                    letterSpacing: ".05em",
+                    fontWeight: 700,
+                    color: "text.secondary",
+                    pb: 1,
+                  },
+                  "& td": { py: 0.5, pr: 1, verticalAlign: "middle" },
+                }}
+              >
+                <thead>
+                  <tr>
+                    <th>Popis</th>
+                    <th>Mn.</th>
+                    <th>Jedn.</th>
+                    <th>Cena</th>
+                    <th>%DPH</th>
+                    <th style={{ width: "40px" }} />
+                  </tr>
+                </thead>
+                <tbody>
+                  {items.map((item, i) => (
+                    <tr key={i}>
+                      <td>
+                        <TextField
+                          value={item.description}
+                          onChange={(e) =>
+                            updateItem(i, "description", e.target.value)
+                          }
+                          sx={{ minWidth: 200 }}
+                        />
+                      </td>
+                      <td>
+                        <TextField
+                          type="number"
+                          value={item.quantity}
+                          onChange={(e) =>
+                            updateItem(
+                              i,
+                              "quantity",
+                              Number(e.target.value) || 0,
+                            )
+                          }
+                          sx={{ width: 90 }}
+                          slotProps={{ htmlInput: { step: "0.001" } }}
+                        />
+                      </td>
+                      <td>
+                        <TextField
+                          value={item.unit}
+                          onChange={(e) =>
+                            updateItem(i, "unit", e.target.value)
+                          }
+                          sx={{ width: 70 }}
+                        />
+                      </td>
+                      <td>
+                        <TextField
+                          type="number"
+                          value={item.unit_price}
+                          onChange={(e) =>
+                            updateItem(
+                              i,
+                              "unit_price",
+                              Number(e.target.value) || 0,
+                            )
+                          }
+                          sx={{ width: 110 }}
+                          slotProps={{ htmlInput: { step: "0.01" } }}
+                        />
+                      </td>
+                      <td>
+                        <TextField
+                          type="number"
+                          value={item.vat_rate}
+                          onChange={(e) =>
+                            updateItem(
+                              i,
+                              "vat_rate",
+                              Number(e.target.value) || 0,
+                            )
+                          }
+                          sx={{ width: 80 }}
+                          slotProps={{ htmlInput: { step: "1" } }}
+                        />
+                      </td>
+                      <td>
+                        <IconButton
+                          size="small"
+                          color="error"
+                          onClick={() => removeItem(i)}
+                          title="Odstranit"
+                          aria-label="Odstranit"
+                        >
+                          <svg
+                            width="16"
+                            height="16"
+                            viewBox="0 0 24 24"
+                            fill="none"
+                            stroke="currentColor"
+                            strokeWidth="2"
+                          >
+                            <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>
+                        </IconButton>
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </Box>
+            </Box>
+          )}
           <Box sx={{ mt: 1.5 }}>
             <Button
               size="small"
diff --git a/src/admin/pages/InvoiceDetail.tsx b/src/admin/pages/InvoiceDetail.tsx
index 33ab72e..10f960c 100644
--- a/src/admin/pages/InvoiceDetail.tsx
+++ b/src/admin/pages/InvoiceDetail.tsx
@@ -1263,93 +1263,106 @@ export default function InvoiceDetail() {
             Položky
           </Typography>
           {invoice.items && invoice.items.length > 0 ? (
-            <TableContainer sx={{ overflowX: "auto" }}>
-              <Table
-                size="small"
-                sx={{ "& td, & th": { borderColor: "divider" } }}
-              >
-                <TableHead>
-                  <TableRow>
-                    <TableCell sx={{ width: "2.5rem" }} align="center">
-                      #
-                    </TableCell>
-                    <TableCell>Popis</TableCell>
-                    <TableCell sx={{ width: "5.5rem" }} align="center">
-                      Množství
-                    </TableCell>
-                    <TableCell sx={{ width: "5rem" }} align="center">
-                      Jednotka
-                    </TableCell>
-                    <TableCell sx={{ width: "8rem" }} align="right">
-                      Jedn. cena
-                    </TableCell>
-                    <TableCell sx={{ width: "4rem" }} align="center">
-                      %DPH
-                    </TableCell>
-                    <TableCell sx={{ width: "9rem" }} align="right">
-                      Celkem
-                    </TableCell>
-                  </TableRow>
-                </TableHead>
-                <TableBody>
-                  {invoice.items.map((item, index) => {
-                    const lineSubtotal =
-                      (Number(item.quantity) || 0) *
-                      (Number(item.unit_price) || 0);
-                    const lineVat = Number(invoice.apply_vat)
-                      ? (lineSubtotal * (Number(item.vat_rate) || 0)) / 100
-                      : 0;
-                    return (
-                      <TableRow key={item.id || index}>
-                        <TableCell
-                          align="center"
-                          sx={{ color: "text.secondary", fontWeight: 500 }}
-                        >
-                          {index + 1}
-                        </TableCell>
-                        <TableCell sx={{ fontWeight: 500 }}>
-                          {item.description || "—"}
-                          {item.item_description && (
-                            <Typography
-                              variant="caption"
-                              sx={{
-                                display: "block",
-                                opacity: 0.8,
-                                mt: "2px",
-                              }}
-                            >
-                              {item.item_description}
-                            </Typography>
-                          )}
-                        </TableCell>
-                        <TableCell align="center">
-                          {item.quantity}{" "}
-                          {item.unit && (
-                            <Box
-                              component="span"
-                              sx={{ color: "text.secondary" }}
-                            >
-                              {item.unit}
-                            </Box>
-                          )}
-                        </TableCell>
-                        <TableCell align="center">{item.unit || "—"}</TableCell>
-                        <TableCell
-                          align="right"
-                          sx={{
-                            fontFamily: "'DM Mono', Menlo, monospace",
-                          }}
+            isMobile ? (
+              <Box sx={{ display: "flex", flexDirection: "column", gap: 1.5 }}>
+                {invoice.items.map((item, index) => {
+                  const lineSubtotal =
+                    (Number(item.quantity) || 0) *
+                    (Number(item.unit_price) || 0);
+                  const lineVat = Number(invoice.apply_vat)
+                    ? (lineSubtotal * (Number(item.vat_rate) || 0)) / 100
+                    : 0;
+                  return (
+                    <Box
+                      key={item.id || index}
+                      sx={{
+                        border: 1,
+                        borderColor: "divider",
+                        borderRadius: 2,
+                        p: 1.5,
+                        display: "flex",
+                        flexDirection: "column",
+                        gap: 0.75,
+                      }}
+                    >
+                      <Box sx={{ fontWeight: 600 }}>
+                        {item.description || "—"}
+                        {item.item_description && (
+                          <Typography
+                            variant="caption"
+                            sx={{
+                              display: "block",
+                              opacity: 0.8,
+                              fontWeight: 400,
+                            }}
+                          >
+                            {item.item_description}
+                          </Typography>
+                        )}
+                      </Box>
+                      <Box
+                        sx={{
+                          display: "flex",
+                          justifyContent: "space-between",
+                          fontSize: ".85rem",
+                        }}
+                      >
+                        <Typography variant="caption" color="text.secondary">
+                          Množství
+                        </Typography>
+                        <span>
+                          {item.quantity} {item.unit}
+                        </span>
+                      </Box>
+                      <Box
+                        sx={{
+                          display: "flex",
+                          justifyContent: "space-between",
+                          fontSize: ".85rem",
+                        }}
+                      >
+                        <Typography variant="caption" color="text.secondary">
+                          Jedn. cena
+                        </Typography>
+                        <Box
+                          component="span"
+                          sx={{ fontFamily: "'DM Mono', Menlo, monospace" }}
                         >
                           {formatCurrency(item.unit_price, invoice.currency)}
-                        </TableCell>
-                        <TableCell align="center">
-                          {Number(invoice.apply_vat)
-                            ? Number(item.vat_rate)
-                            : 0}
-                          %
-                        </TableCell>
-                        <TableCell
-                          align="right"
+                        </Box>
+                      </Box>
+                      {Number(invoice.apply_vat) ? (
+                        <Box
+                          sx={{
+                            display: "flex",
+                            justifyContent: "space-between",
+                            fontSize: ".85rem",
+                          }}
+                        >
+                          <Typography variant="caption" color="text.secondary">
+                            %DPH
+                          </Typography>
+                          <span>{Number(item.vat_rate)}%</span>
+                        </Box>
+                      ) : null}
+                      <Box
+                        sx={{
+                          display: "flex",
+                          justifyContent: "space-between",
+                          alignItems: "baseline",
+                          pt: 0.5,
+                          borderTop: 1,
+                          borderColor: "divider",
+                        }}
+                      >
+                        <Typography
+                          variant="caption"
+                          sx={{ color: "text.secondary", fontWeight: 700 }}
+                        >
+                          Celkem
+                        </Typography>
+                        <Box
+                          component="span"
                           sx={{
                             fontFamily: "'DM Mono', Menlo, monospace",
                             fontWeight: 600,
@@ -1359,13 +1372,119 @@ export default function InvoiceDetail() {
                             lineSubtotal + lineVat,
                             invoice.currency,
                           )}
-                        </TableCell>
-                      </TableRow>
-                    );
-                  })}
-                </TableBody>
-              </Table>
-            </TableContainer>
+                        </Box>
+                      </Box>
+                    </Box>
+                  );
+                })}
+              </Box>
+            ) : (
+              <TableContainer sx={{ overflowX: "auto" }}>
+                <Table
+                  size="small"
+                  sx={{ "& td, & th": { borderColor: "divider" } }}
+                >
+                  <TableHead>
+                    <TableRow>
+                      <TableCell sx={{ width: "2.5rem" }} align="center">
+                        #
+                      </TableCell>
+                      <TableCell>Popis</TableCell>
+                      <TableCell sx={{ width: "5.5rem" }} align="center">
+                        Množství
+                      </TableCell>
+                      <TableCell sx={{ width: "5rem" }} align="center">
+                        Jednotka
+                      </TableCell>
+                      <TableCell sx={{ width: "8rem" }} align="right">
+                        Jedn. cena
+                      </TableCell>
+                      <TableCell sx={{ width: "4rem" }} align="center">
+                        %DPH
+                      </TableCell>
+                      <TableCell sx={{ width: "9rem" }} align="right">
+                        Celkem
+                      </TableCell>
+                    </TableRow>
+                  </TableHead>
+                  <TableBody>
+                    {invoice.items.map((item, index) => {
+                      const lineSubtotal =
+                        (Number(item.quantity) || 0) *
+                        (Number(item.unit_price) || 0);
+                      const lineVat = Number(invoice.apply_vat)
+                        ? (lineSubtotal * (Number(item.vat_rate) || 0)) / 100
+                        : 0;
+                      return (
+                        <TableRow key={item.id || index}>
+                          <TableCell
+                            align="center"
+                            sx={{ color: "text.secondary", fontWeight: 500 }}
+                          >
+                            {index + 1}
+                          </TableCell>
+                          <TableCell sx={{ fontWeight: 500 }}>
+                            {item.description || "—"}
+                            {item.item_description && (
+                              <Typography
+                                variant="caption"
+                                sx={{
+                                  display: "block",
+                                  opacity: 0.8,
+                                  mt: "2px",
+                                }}
+                              >
+                                {item.item_description}
+                              </Typography>
+                            )}
+                          </TableCell>
+                          <TableCell align="center">
+                            {item.quantity}{" "}
+                            {item.unit && (
+                              <Box
+                                component="span"
+                                sx={{ color: "text.secondary" }}
+                              >
+                                {item.unit}
+                              </Box>
+                            )}
+                          </TableCell>
+                          <TableCell align="center">
+                            {item.unit || "—"}
+                          </TableCell>
+                          <TableCell
+                            align="right"
+                            sx={{
+                              fontFamily: "'DM Mono', Menlo, monospace",
+                            }}
+                          >
+                            {formatCurrency(item.unit_price, invoice.currency)}
+                          </TableCell>
+                          <TableCell align="center">
+                            {Number(invoice.apply_vat)
+                              ? Number(item.vat_rate)
+                              : 0}
+                            %
+                          </TableCell>
+                          <TableCell
+                            align="right"
+                            sx={{
+                              fontFamily: "'DM Mono', Menlo, monospace",
+                              fontWeight: 600,
+                            }}
+                          >
+                            {formatCurrency(
+                              lineSubtotal + lineVat,
+                              invoice.currency,
+                            )}
+                          </TableCell>
+                        </TableRow>
+                      );
+                    })}
+                  </TableBody>
+                </Table>
+              </TableContainer>
+            )
           ) : (
             <EmptyState title="Žádné položky." />
           )}