h1,
h1 a,
a:hover,
#overheader a:hover,
#overheader a.arisuchan,
#overheader i,
#overheader i:hover,
.name,
.catlink a:hover {
    color: #be132d;
}

.thread > .files {
     border-left: 0.5rem solid #be132d;
}

.thread {
  display: flex;
  flex-flow: row wrap;
  color: #949494;
  margin: auto !important;
  margin-bottom: 10px !important;
}

.banner {
  margin: auto !important;
}

.testtt {
    color: #be132d !important;
}

.capcode,
.catlink a:hover,
.quote,
.thread a:hover {
    color: red;
}
.thread a {
    text-decoration: none !important;
}

@media only screen and (max-width: 900px) {

    div.op {
        border-left: 0.5rem solid #be132d;
    }

}
.hover-green a:hover{
    color: red;
}

.hide-reply-link {
    position: absolute;
    top: 5px;             /* or whatever small offset from top you want */
    right: 5px;           /* instead of margin-right */
    z-index: 1;
    height: 2rem;
    font-size: 10px;
    /* No need for margin-left: auto anymore */
    /* padding: 0 8px;   â† optional, if you want it to look button-like */
}


.thread .intro .hide-thread-link {
    position: absolute;
    top: 5px;             /* or whatever small offset from top you want */
    right: 5px;           /* instead of margin-right */
    z-index: 1;
    height: 2rem;
    font-size: 10px;
    /* No need for margin-left: auto anymore */
    /* padding: 0 8px;   â† optional, if you want it to look button-like */
}


.thread > .hide-thread-link {
  display: block;
  float: none;
  width: 1420px!important;
  padding: 0 0 0.5rem;
  font-size: 0.7rem;
  margin-left: 0!important;
  margin-right:0!important;
}

.post:not(.post-hover){
    position: relative!important;
}

/* Only add bottom padding when backlinks are present */
.post:has(> .mentioned.backlink) {
    padding-bottom: 0.8rem;  /* adjust this value to match your backlinks height + desired gap */
}
.post.op:has(> .mentioned.backlink) {
    padding-bottom: 1.8rem;  /* adjust this value to match your backlinks height + desired gap */
}

/* The single backlinks container - pinned to bottom */
.mentioned.backlink {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 3px 0px;           /* comfortable spacing */
    text-align: left;            /* change to center/right if you prefer */
    z-index: 1;
    box-sizing: border-box;
    line-height: 1.4;           /* helps with vertical centering */
    font-size: 0;               /* removes whitespace gaps between inline elements */
    vertical-align: middle;     /* ensures all children align properly */
}

/* The "mentioned:" label */
.mentioned.backlink sub {
    color: #9a9a9a !important;
    font-size: 10px;
    margin-right: 6px;          /* space after "mentioned:" */
    /* Key fixes: */
    vertical-align: middle;     /* align to middle of line instead of baseline */
    position: relative;
    top: 0;                     /* fine-tune if needed (rarely) */
}

/* The backlinks */
.mentioned.backlink a {
    display: inline-block;
    font-size: 12px;
    color: #df729c !important;
    margin-right: 6px;
    /* Key fix: align to middle of the line */
    vertical-align: middle;
}

/* Remove margin after the last link */
.mentioned.backlink a:last-child {
    margin-right: 0;
}

/* Optional: subtle top border to separate from post body */
.mentioned.backlink::before {
    position: absolute;
    top: 0;
    left: 10px;
    right: 10px;
    height: 1px;
}


/* Exclude webring table from the 1500px mobile layout rules */
    #webringwindow table,
    #webringwindow th,
    #webringwindow td {
        width: auto !important;
        flex-flow: initial !important;
        display: table-cell !important; /* th and td stay as table cells */
        text-align: initial !important;
        padding: initial !important;
    }

    /* Ensure the table stays wide with horizontal scroll on small screens */
    #webringwindow .webringlist {
        overflow-x: auto !important;
    }

header {
    transform: translateY(30px);
}

.active-index header {
    transform: none;
}

.active-thread header {
    transform: none;
}

.active-publiclogs header {
    transform: none;
}

table.modlog {
  display: block;          /* Allows overflow on the table itself */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100% !important;  /* Override any wider intrinsic width */
  box-sizing: border-box;
}

table.modlog > tbody {
  display: table;
  width: 100%;
}

.redtext {
    color: #f47a7a;
}

.floating {
    display: flex;
}

.floating .post.op {
    flex: 1;                    /* Text takes remaining space */
    min-width: 0;               /* Allows text to shrink properly */
    box-shadow: none;
    margin-bottom: 0px!important;
}

.floating .files {
    margin-bottom: 0px!important;
}

.floating:has(.op) {
    border: 1px solid red;
    padding: 0px 0px 0px 0px!important;
}

.floating .body {
  display: -webkit-box;          /* Required for line-clamp to work */
  -webkit-line-clamp: 20;         /* Change this to your desired number of lines, e.g., 2, 3, 4 */
  -webkit-box-orient: vertical;  /* Required */
  overflow: hidden;              /* Hides the overflow */
  text-overflow: ellipsis;       /* Adds the ellipsis (works with line-clamp) */
}

/* single-image replies layout */
@media (min-width: 650px) {
  .post.reply:has(.file):not(:has(.multifile)) {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
      "files intro"
      "files body"
      "files backlink";
    gap: 0.5rem;
  }

  .post.reply:has(.file):not(:has(.multifile)) > .files {
    grid-area: files;
    max-width: 250px;
    margin-bottom: 1rem;
  }

  .post.reply:has(.file):not(:has(.multifile)) > p.intro {
    grid-area: intro;
  }

  .post.reply:has(.file):not(:has(.multifile)) > .body {
    grid-area: body;
    margin-left: 15px;
    max-width: 97%;
    box-sizing: border-box;
    min-width: 0;           /* prevents long unbreakable content from overflowing */
  }

  .post.reply:has(.file):not(:has(.multifile)) > .mentioned.backlink {
    grid-area: backlink;
    margin-left: 15px;
    margin-bottom: -10px;
  }
}



.controls {
    position: absolute;
	margin-right: 0px!important;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 3px 0px;           /* comfortable spacing */
    text-align: left;            /* change to center/right if you prefer */
    z-index: 2;
    box-sizing: border-box;
    line-height: 1.4;           /* helps with vertical centering */
    font-size: 0;               /* removes whitespace gaps between inline elements */
    vertical-align: middle;     /* ensures all children align properly */
}
.fileinfo .controls {
	position:relative;
}

.op.controls{
    position: absolute;
    bottom: -.5rem;
    left: 0;
    right: 0;
    padding: 3px 0px;           /* comfortable spacing */
    text-align: left;            /* change to center/right if you prefer */
    z-index: 2;
    box-sizing: border-box;
    line-height: 1.4;           /* helps with vertical centering */
    font-size: 0;               /* removes whitespace gaps between inline elements */
    vertical-align: middle;     /* ensures all children align properly */
}

.active-search .post {
    margin:auto!important;
}

div.pages-center {
display: flex;
  justify-content: center;
  margin: 8px 0 4px 0;          /* no need for auto here */
}

button.formopen-center {
display: flex;
  justify-content: center;
  margin: auto;          /* no need for auto here */
}

.active-catalog .toolong {
    display:none;
}


.breathing {
        display: inline-block;
        color: #727272;
        opacity: 0;
        animation: breathe 1s ease-in-out infinite;
      }
      @keyframes breathe {
        0%, 100%   { opacity: 0.0; transform: scale(1.00); }
        50%        { opacity: 1.00; transform: scale(1.00); }
      }



.spoiler {
    background-image: url(/static/spoilertext.png);
    background-repeat:repeat-x;
    background-position-y:bottom;
}

.spoiler:hover {
    background-image: none;
}

span.spoiler {
  color: #00000000;
}

form[name="postcontrols"] {
	margin-left:1vw;
}


.logpages span {
	color:#333;
}
