/* ---- Table alignment (data-table-align, set via TableContextMenu; also
   used by the .docx/PDF exporters so on-screen, printed and exported
   alignment all agree). Only has a visible effect when the table is
   narrower than its container (i.e. it has an explicit width / fixed
   column widths), exactly like Word. -------------------------------- */
.docx-editor-content table[data-table-align="left"],
.docx-editor-content .ProseMirror table[data-table-align="left"] {
  margin-left: 0;
  margin-right: auto;
}
.docx-editor-content table[data-table-align="center"],
.docx-editor-content .ProseMirror table[data-table-align="center"] {
  margin-left: auto;
  margin-right: auto;
}
.docx-editor-content table[data-table-align="right"],
.docx-editor-content .ProseMirror table[data-table-align="right"] {
  margin-left: auto;
  margin-right: 0;
}
.docx-editor-content th,
.docx-editor-content td,
.docx-editor-content .ProseMirror th,
.docx-editor-content .ProseMirror td {
  border: 1px solid #d0d7de;
  /* Word/Google-Docs-style cell margins — enough breathing room that a
     freshly-inserted table doesn't look cramped or squeezed. */
  padding: 8px 12px;
  vertical-align: top;
  text-align: left;
  /* Needed so `.selectedCell:after` (below) positions relative to the cell
     itself rather than the nearest positioned ancestor (`.docx-editor-page`). */
  position: relative;
}
.docx-editor-content th, .docx-editor-content .ProseMirror th {
  background: #f6f8fa;
  font-weight: 600;
}
.docx-editor-content td p, .docx-editor-content .ProseMirror td p,
.docx-editor-content th p, .docx-editor-content .ProseMirror th p {
  margin: 0;
}

/* ---- Table border presets (data-border-style, set via TableContextMenu's
   "Borders" picker, see table-enhancements.ts) -------------------------- */
.docx-editor-content .ProseMirror table[data-border-style="all"] th,
.docx-editor-content .ProseMirror table[data-border-style="all"] td {
  border: 1px solid #d0d7de;
}
.docx-editor-content .ProseMirror table[data-border-style="outside"] {
  border: 1px solid #1f2328;
}
.docx-editor-content .ProseMirror table[data-border-style="outside"] th,
.docx-editor-content .ProseMirror table[data-border-style="outside"] td {
  border: none;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] {
  border: none;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] th,
.docx-editor-content .ProseMirror table[data-border-style="inside"] td {
  border: 1px solid #d0d7de;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] tr:first-child th,
.docx-editor-content .ProseMirror table[data-border-style="inside"] tr:first-child td {
  border-top: none;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] tr:last-child th,
.docx-editor-content .ProseMirror table[data-border-style="inside"] tr:last-child td {
  border-bottom: none;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] th:first-child,
.docx-editor-content .ProseMirror table[data-border-style="inside"] td:first-child {
  border-left: none;
}
.docx-editor-content .ProseMirror table[data-border-style="inside"] th:last-child,
.docx-editor-content .ProseMirror table[data-border-style="inside"] td:last-child {
  border-right: none;
}
.docx-editor-content .ProseMirror table[data-border-style="top"],
.docx-editor-content .ProseMirror table[data-border-style="bottom"],
.docx-editor-content .ProseMirror table[data-border-style="left"],
.docx-editor-content .ProseMirror table[data-border-style="right"],
.docx-editor-content .ProseMirror table[data-border-style="none"] {
  border: none;
}
.docx-editor-content .ProseMirror table[data-border-style="top"] th,
.docx-editor-content .ProseMirror table[data-border-style="top"] td,
.docx-editor-content .ProseMirror table[data-border-style="bottom"] th,
.docx-editor-content .ProseMirror table[data-border-style="bottom"] td,
.docx-editor-content .ProseMirror table[data-border-style="left"] th,
.docx-editor-content .ProseMirror table[data-border-style="left"] td,
.docx-editor-content .ProseMirror table[data-border-style="right"] th,
.docx-editor-content .ProseMirror table[data-border-style="right"] td,
.docx-editor-content .ProseMirror table[data-border-style="none"] th,
.docx-editor-content .ProseMirror table[data-border-style="none"] td {
  border: none;
}
.docx-editor-content .ProseMirror table[data-border-style="top"] {
  border-top: 1px solid #1f2328;
}
.docx-editor-content .ProseMirror table[data-border-style="bottom"] {
  border-bottom: 1px solid #1f2328;
}
.docx-editor-content .ProseMirror table[data-border-style="left"] {
  border-left: 1px solid #1f2328;
}
.docx-editor-content .ProseMirror table[data-border-style="right"] {
  border-right: 1px solid #1f2328;
}

/* ---- Table style presets (data-table-style, set via TableContextMenu's
   "Table style" gallery, see table-enhancements.ts). Manual per-cell
   background colors and border picks always win because inline styles beat
   these attribute-selector rules. ------------------------------------- */
.docx-editor-content .ProseMirror table[data-table-style="plain"] th,
.docx-editor-content .ProseMirror table[data-table-style="plain"] td {
  border-color: #eceef1;
  background: #fff;
  font-weight: inherit;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading"] th {
  background: #dbeafe;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading"] td,
.docx-editor-content .ProseMirror table[data-table-style="light-shading"] th {
  border-color: #bfdbfe;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading"] tr:nth-child(even) td {
  background: #eff6ff;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading-accent"] th {
  background: #dcfce7;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading-accent"] td,
.docx-editor-content .ProseMirror table[data-table-style="light-shading-accent"] th {
  border-color: #bbf7d0;
}
.docx-editor-content .ProseMirror table[data-table-style="light-shading-accent"] tr:nth-child(even) td {
  background: #f0fdf4;
}
.docx-editor-content .ProseMirror table[data-table-style="medium-grid"] th {
  background: #1f2937;
  color: #fff;
}
.docx-editor-content .ProseMirror table[data-table-style="medium-grid"] td,
.docx-editor-content .ProseMirror table[data-table-style="medium-grid"] th {
  border: 1px solid #1f2937;
}
.docx-editor-content .ProseMirror table[data-table-style="grid-light"] th {
  background: #f3f4f6;
}
.docx-editor-content .ProseMirror table[data-table-style="grid-light"] td,
.docx-editor-content .ProseMirror table[data-table-style="grid-light"] th {
  border-color: #e5e7eb;
}
.docx-editor-content .ProseMirror table[data-table-style="list-table"] th {
  background: #e5e7eb;
}
.docx-editor-content .ProseMirror table[data-table-style="list-table"] td,
.docx-editor-content .ProseMirror table[data-table-style="list-table"] th {
  border-left: none;
  border-right: none;
  border-color: #eceef1;
}
.docx-editor-content .ProseMirror table[data-table-style="colorful-grid"] th {
  background: #2563eb;
  color: #fff;
}
.docx-editor-content .ProseMirror table[data-table-style="colorful-grid"] td,
.docx-editor-content .ProseMirror table[data-table-style="colorful-grid"] th {
  border-color: #2563eb;
}
.docx-editor-content .ProseMirror table[data-table-style="colorful-grid"] tr:nth-child(even) td {
  background: #eff6ff;
}

/* ---- Column resize (native prosemirror-tables, `resizable: true`) ----- */
.docx-editor-content .ProseMirror .column-resize-handle {
  position: absolute;
  top: 0;
  bottom: -2px;
  width: 4px;
  background: #2563eb;
  opacity: 0;
  pointer-events: none;
  z-index: 20;
}
.docx-editor-content .ProseMirror.resize-cursor {
  cursor: col-resize;
}
.docx-editor-content .ProseMirror table:hover .column-resize-handle {
  opacity: 0.4;
}

/* ---- Row resize handle + insert row/column buttons (custom, see
   table-interactions.ts) ------------------------------------------------ */
.docx-table-row-resize-handle {
  background: transparent;
  border-top: 2px solid transparent;
}
.docx-table-row-resize-handle:hover {
  border-top-color: #2563eb;
}
.docx-table-insert-btn {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid #2563eb;
  background: #fff;
  color: #2563eb;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
.docx-table-insert-btn:hover {
  background: #2563eb;
  color: #fff;
}

/* ---- "Move table" grip handle + drop indicator (table-move-handle.ts) - */
.docx-table-move-handle {
  position: absolute;
  z-index: 16;
  width: 22px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d0d7de;
  border-radius: 4px;
  background: #fff;
  color: #6b7280;
  font-size: 12px;
  line-height: 1;
  cursor: grab;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.docx-table-move-handle:hover {
  color: #2563eb;
  border-color: #2563eb;
}
.docx-table-move-handle:active {
  cursor: grabbing;
}
.docx-table-drop-line {
  position: absolute;
  z-index: 16;
  height: 2px;
  background: #2563eb;
  pointer-events: none;
}
.docx-table-drop-line::before {
  content: "";
  position: absolute;
  left: -4px;
  top: -3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2563eb;
}

/* ---- Row/column selector handles (table-selector-handles.ts) --------- */
.docx-table-row-handle,
.docx-table-col-handle {
  position: absolute;
  z-index: 15;
  border: 1px solid transparent;
  background: #e5e7eb;
  cursor: pointer;
  padding: 0;
}
.docx-table-row-handle {
  width: 12px;
  border-radius: 3px;
}
.docx-table-col-handle {
  height: 10px;
  border-radius: 3px;
}
.docx-table-row-handle:hover,
.docx-table-col-handle:hover {
  background: #2563eb;
}