header {
  background: #007479;
}
/*LogIn*/
.auth-content .text-input{
    margin:auto;
    padding: .7rem 1rem;
display: block;
width: 75%;
border-radius: 5px;
border: 1px solid red;
color: #444;
line-height: 1.5rem;
font-family: 'lora', 'cursive';
font-size: 1.2em;
}
/*LogIn*/
.admin-wrapper {
    width:100%;
  display: flex;
  height: calc(100% - 66px);
}

.admin-wrapper .left-sidebar {
flex: 2;
height: 100%;
background: #234a57;
}
.content .success {
color: #103610;
border: 1px solid #0c170c;
background: #bcf5bc;
height: 35px;
line-height: normal;
}
.content .success p{
    margin:auto;
    padding:0;
}
.admin-wrapper .left-sidebar ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
  color: aliceblue;
}

.admin-wrapper .left-sidebar ul li a {
  padding: 18px;
  display: block;
  border-bottom: 1px solid #113745;
}

.admin-wrapper .left-sidebar ul li a:hover{
  background: #113745;
}

.admin-wrapper .admin-content {
    flex:21;
    width:100%;
    height: 100%;
    padding: 30px 50px 50px;
    overflow-y: scroll;
}

.admin-wrapper .admin-content .text-input {
padding: .7rem 1rem;
display: block;
width: 75%;
border-radius: 5px;
border: 1px solid red;
color: #444;
line-height: 1.5rem;
font-family: 'lora', 'cursive';
font-size: 1.2em;
}
.admin-wrapper .admin-content .text-input-img {
padding: .7rem 1rem;
display: block;
width: 55%;
border-radius: 5px;
border: 1px solid red;
color: #444;
line-height: 0.6rem;
font-family: 'lora', 'cursive';
font-size: 1.1em;
}
.admin-wrapper .admin-content .selected-image-preview img{
    display:block;
    width:20%;
}
/* Edit.php content */

#content-blocks-container{
    display:flex;
  flex-wrap: wrap;
    width:100%;
    border:2px solid black;
}
#content-blocks-container .content-block{
 width:100%;
        border:3px solid red;
          display:flex;
  flex-wrap: wrap;
  flex-direction:column;
}
        .alignment-options {
            display: flex;
            gap: 10px;
            margin: 10px 0;
        }
        .alignment-option {
            padding: 8px 12px;
            border: 2px solid #ddd;
            border-radius: 4px;
            cursor: pointer;
            transition: all 0.3s;
        }
        .alignment-option:hover {
            border-color: #3498db;
        }
        .alignment-option.selected {
            border-color: #3498db;
            background-color: #e8f4fd;
            font-weight: bold;
        }
       /*.content-block */  .subheader-input {
            width: 550px;
            padding: 12px;
            font-size: 16px;
            border: 2px solid #ddd;
            border-radius: 4px;
            margin-bottom: 15px;
            border:dashed 3px #850c0c ;
        }
     /*.content-block */   .subheader-input:focus {
            width:550px;
            border-color: #3498db;
            outline: none;
        }
/* Edit.php content */
.admin-content .page-title {
     font-family: "Times New Roman", Times, serif;
   text-align: center;
  margin-bottom: 1.5rem;
}
.admin-wrapper .content{
    flex:15;
    background:#f7edf3;
    width:100%;
    border-radius:15px;
}
table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.05rem;
}

th, td {
  padding: 15px;
  text-align: left;
  border-bottom: 1px solid #d3d3d3;
}

.edit {
  color: green;
  }

.delete {
  color: red;
}

.publish{
  color: blue;
}
.edit:hover,
.delete:hover,
.publish:hover {
  text-decoration: underline;
}
form div {
  margin-bottom: 15px;
}
.sort-header {
    
    text-decoration: none;
    color: #333;
    font-weight: bold;
    display: block;
    background: #e6e7f5;
  border-radius: 15px;
  width:100%;
  min-width:55px;
}
.filter_input {
background: #fcfafa;
color: #400404;
margin-bottom: 10px;
height:35px;
padding: .9rem 0.7rem;
border : solid 1px black;
  border-radius: 15px;
}
.post_id{
width:40px;
align-content:center; 
}
/*fa page*/
.qa-item {
    flex:2;
    display:flex;
    flex-direction:column;
    padding:0;
    margin:0;
padding-bottom:-8px;
    width:100%;
      position:relative;
   }
.question{
    flex:1;
  font-family: "Times New Roman", Times, serif;
 padding-left:10px;
  font-size: 1.1rem;
  text-align: left;
  position:relative;
     margin-left:5px;
      width: 95%;
  /*height: 30px;*/
}
.answer{
 display: none;
    flex:1;
    font-family:'Antic Slab', serif;
    padding-left:10px;
  font-size: .9rem;
  text-align: left;
  position:relative;
     margin-left:5px;
      width: 95%;
    color:black;
  /*height: 150px;*/
}
.create_qa {
    display: flex;
    flex-flow: column wrap;
    gap: 15px; /* Adds spacing between rows */
}

.create_qa > div {
    display: flex;
    flex-direction: column; /* This stacks label and textarea vertically */
}

.label_create {
    margin-bottom: 5px; /* Adds space between label and textarea */
    font-weight: bold; /* Optional: makes labels stand out more */
}

.question_create {
    font-family: 'Antic Slab', serif;
    padding: 10px;
    font-size: 1.1rem;
    text-align: left;
    width: 70%; /* Use full width of parent */
    height: 30px;
    box-sizing: border-box; /* Includes padding in width calculation */
}

.answer_create {
    font-family: 'Antic Slab', serif;
    padding: 10px;
    font-size: 1.1rem;
    text-align: left;
    width: 100%; /* Use full width of parent */
    color: black;
    height: 175px;
    box-sizing: border-box; /* Includes padding in width calculation */
}
/*Qa */
.qa-section{
 font-family: "Times New Roman", Times, serif;
  font-size: 1.2em;
    font-weight: bold;
    color: #333;
    line-height: normal;
 
}

/* Basic styling for the Q&A section */
.qa-section {

    border-top: 2px solid #eee;
}
.qa-section h2 {
    font-family: "Times New Roman", Times, serif;
    font-size: 1.1em;
    
    border-bottom:2px solid black;
     display: inline-block;
}