:root {
  --accent: #4caf50; /* tweak to taste */
  --bg: #0d1117;
  --fg: #e6edf3;
  --muted: #8b949e45;
  --font: system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  text-align: left;
}

.taskContainer{
	height:100%;

}

.application-cont.active {
	height:75vh;
	
}


h3{

	margin-left:0;
    text-align: left;
    font-size:1.5rem;
}

/* ───── Collapsible styling ───── */
details {
	cursor:pointer;
  border: 1px solid var(--muted);
  padding: 1rem;
  background: #161b22;
  transition: all 0.2s ease-in-out;
  margin: auto;
  margin-top: 1rem;
  border-radius: 5px;
  color: whitesmoke;
  width: 90%;
  position: relative;
	top:0;  
  min-height: fit-content;
}

summary {
  cursor: pointer;
  display: block;
  position: relative;
  left: 0;
  top: 0;
  align-items: left;
  gap: 0.4rem;
  list-style: none;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--accent);
  user-select: none;
  width: 90%;
  text-align: left;
  height: fit-content;
  overflow: scroll;
  position: relative;
top:0;  

}

summary::-webkit-details-marker {
  display: none;
}
summary::marker {
  content: "";
}
summary::before {
  content: "";
  transition: transform 0.15s;
  -webkit-transition: -webkit-transform 0.2s
}

details[open] summary::before {
  transform: rotate(90deg);
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
}
details details {
  border: none;
  padding: 0.25rem 0.5rem;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
}
details details summary {
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--fg);
}

details:hover { background: var(--muted); color: var(whitesmoke); border: 1px solid var(--accent); opacity:1; position:relative; display:block;}
details details:hover { background-color: rgba(255, 89, 0, 0.333); color: whitesmoke; border: 1px solid var(--accent); }
section,
.section { margin: auto;  max-width: 90%; padding: 1rem; display: block;
}
ol,
ul,
li,
section > p,
.section > p{ list-style-position: inside; text-align: left; font-weight:300; width: 90%;}
p{ padding-inline-start: 40px; margin-left:0; }
.content-inner > h3 { text-align: left; }
strong{ color:orangered; }

div{ text-align: left; margin-left:0; }
h4{ width:90%; display:block; wrap:wrap;}

a{ color:rgb(230, 107, 255); }


#abstract-pane {
  background: #f7f9fa;
  border-left: 5px solid #4a90e2;
  padding: 2rem;
  margin: 2rem auto;
  max-width: 800px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  font-family: Georgia, serif;
}

#abstract-pane h2 {
  margin-top: 0;
  font-size: 1.8rem;
  color: #333;
}

.reference-meta p {
  margin: 0.3rem 0;
  font-size: 0.95rem;
  color: #555;
}

.download-button {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.75rem 1.25rem;
  background-color: #4a90e2;
  color: white;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: background 0.3s;
}

.download-button:hover {
  background-color: #357ab8;
}

#abstract-pane {
  background: #f7f9fa;
  border-left: 5px solid #4a90e2;
  padding: 2rem;
  margin: 2rem auto;
  max-width: 800px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  font-family: Georgia, serif;
}

#abstract-pane h2 {
  margin-top: 0;
  font-size: 1.8rem;
  color: #333;
}

.reference-meta p {
	margin: 0.3rem 0;
	font-size: 0.95rem;
	color: #c3c3c3;
}


.download-button {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.75rem 1.25rem;
  background-color: #4a90e2;
  color: white;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: background 0.3s;
}

.download-button:hover {
  background-color: #357ab8;
}

            #citation-block {
                margin-top: 2rem;
                background: #eef2f7;
                padding: 1rem;
                border-left: 4px solid #4a90e2;
                border-radius: 6px;
            }
            #citation-block pre {
                white-space: wrap;
                font-family: Georgia, serif;
                font-size: 0.95rem;
                background: none;
                border: none;
                margin: 0;
                padding: 0;
                padding-bottom:3%;
                scrollbar-width: 0;
            }
            ::-webkit-scrollbar{
                height:0;
                width:0;
                display: none;
            }
            pre{
                text-wrap: wrap;
                cursor:text;
                overflow-y:scroll;
            }
            .copy-btn{
                all:unset;
                border-radius:10px;
                
                background-color: #35b84b;
                display:flex;
                justify-content: space-between;
                width:100px;
                max-width:80%;
                margin-top: 0.5rem;
                color: white;
                border: none;
                padding: 0.5rem 1rem;
                border-radius: 4px;
                font-weight: bold;
                cursor: pointer;
                transition: background-color 0.3s ease;
                padding:1rem;
                font-size:0.8rem;
                
            }
            
            .copy-btn > img{
                width:25px;
                height:25px;
            }
            
            .copy-btn:focus{
                all:unset;
                border-radius:10px;
                color:black;
                background-color: #35b84b;
                display:flex;
                justify-content: space-between;
                width:100px;
                max-width:80%;
                margin-top: 0.5rem;
                color: black;
                border: none;
                padding: 0.5rem 1rem;
                border-radius: 4px;
                font-weight: bold;
                cursor: pointer;
                transition: background-color 0.3s ease;
                padding:1rem;
                font-size:0.8rem;
            }
            
            .copy-btn:active{
                all:unset;
                border-radius:10px;
                background-color: #35b84b;
                display:flex;
                justify-content: space-between;
                width:100px;
                max-width:80%;
                margin-top: 0.5rem;
                color: black;
                border: none;
                padding: 0.5rem 1rem;
                border-radius: 4px;
                font-weight: bold;
                cursor: pointer;
                transition: background-color 0.3s ease;
                padding:1rem;
                font-size:0.8rem;
            }
            .copy-btn:hover{
                all:unset;
                border-radius:10px;
                background-color: #35b84b;
                display:flex;
                justify-content: space-between;
                width:100px;
                max-width:80%;
                margin-top: 0.5rem;
                color:black;
                border: none;
                padding: 0.5rem 1rem;
                border-radius: 4px;
                font-weight: bold;
                cursor: pointer;
                transition: background-color 0.3s ease;
                padding:1rem;
                font-size:0.9rem;
            }