/* assets/css/layout.css - DarkSwords-style frame geometry */

:root{
  --ts-width: 1000px;
  --ts-left: 228px;
  --ts-center: 604px;
  --ts-right: 168px;
  --ts-header-h: 140px;
}

body.ts{
  min-height: 100%;
}

/* Top frame */
.ts-topFrame td { padding: 0; }
#headerleft, #headerright {
  height: var(--ts-header-h);
  background: #000; /* will be replaced by slice images later */
}
#header{
  width: var(--ts-width);
  height: var(--ts-header-h);
  position: relative;
  overflow: hidden;
  background: #120706; /* header center */
}

/* Body frame */
.ts-bodyFrame td { padding: 0; vertical-align: top; }

.ts-sideFill{
  background: #000; /* side fill (sliced backgrounds later) */
}

#conteiner{
  width: var(--ts-width);
}

/* Center background like DS (replace with your center bg image if you want) */
#centerBg{
  background: #120706;
  background-image: url("assets/img/placeholders/center-bg.jpg");
  background-repeat: repeat-y;
  background-position: center top;
}

/* Column widths locked */
.ts-leftCol{ width: var(--ts-left); }
.ts-centerCol{ width: var(--ts-center); }
.ts-rightCol{ width: var(--ts-right); }

/* Center wrap keeps spacing like DS */
.ts-centerWrap{
  width: var(--ts-center);
  padding: 18px 0 30px;
}