body {
    font-family: Helvetica, Arial, sans-serif;
    margin-left: 30px;
    background: #fff;
}




/* ################################################
the following were taken from dansimons.com to match the style there. These bits are only
used to make the navigation and header work. If you delete those parts of the index.html page
you can delete this section too.
################################################
*/


/* The div below wraps around my name and the navigation menu items.  It does not include the triangle indicating the current page */
#navwrap {
	position:relative;
	max-width:1024px;
	height:70px;
	margin-top:20px;
	padding:0px;
	background:#FFF;
	padding-bottom:10px;
}

	#navwrap a {
		line-height: 1;
	}


/* The div below is just for my first name in the page header */
	#navwrap .Daniel,
	#navwrap .Simons {
		font-family: Arial Black, Arial, sans-serif;
		font-size: 36px;
		font-weight: 100;
		float: left;
		margin-top: 25px;
	}
	
	#navwrap .Daniel { color: #041675; }
	#navwrap .Simons {
		color: #04667f;
		margin-left: 8px;
		margin-right: 20px;
	}


	#navwrap .Daniel a,
	#navwrap .Simons a {
		text-decoration: none;
		color: inherit;
	}


/* The div below is for the link for the pages other than the current one */
	#navwrap .unselected {
		font-family: Arial, sans-serif;
		float:left;
		font-size:100%;
		font-weight:700;
		margin-top:50px;
		margin-left:17px;
		height:30px;
		color:#000000;
		line-height: 1;
	}

		#navwrap .unselected a {
			font-size: 13px;
			line-height: 1;
			color: #000;
			text-decoration: none;
		}
		
		#navwrap .unselected a:hover,
		#navwrap .unselected a:active {
			color: #04667f;
		}

#navwrap + img {
    display: block;
}


/* The div below is for the link for the current page 
	#navwrap .selected {
		font:Arial, sans-serif;
		font-size:100%;
		float:left;
		font-weight:900;
		margin-top:50px;
		margin-left:17px;
		height:25px;
		color:#04667f;
		background-image:url('multimedia/images/triangle.jpg');
		background-repeat:no-repeat;
		background-position:bottom;
	}
*/



/* ################################################
End section from dansimons.com
################################################ */


/* ################################################
/* CSS FIELDS FOR THE ADMIN INTERFACE TO KEEP EVERYTHING VIEWABLE


/* ----- Existing Articles table layout refinements ----- */

/* Scope changes to the bottom section only; keep left-aligned */
.existing-articles-wrap {
  max-width: 1300px;    /* widened from 1100px; adjust to taste */
  padding: 0 8px;
  margin: 0;            /* left aligned */
}

.existing-articles-inner {
  overflow-x: auto;     /* safety on small screens */
  -webkit-overflow-scrolling: touch;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
}

.existing-articles-table {
  width: 100%;
  table-layout: fixed;  /* honor column widths */
  border-collapse: collapse;
}

.existing-articles-table th,
.existing-articles-table td {
  padding: 8px;
  border-bottom: 1px solid #eee;
  vertical-align: top;
}

/* Column widths — order now: #, Actions, Citation, Year, Abstract, PDF, Dropbox, URL, OSF */
.col-idx     { width: 30px;  }
.col-actions { width: 130px; }  /* more room for buttons */
.col-year    { width: 60px;  }
.col-cite    { width: 420px; }  /* wider citation column that **wraps** */
.col-abs     { width: 260px; }
.col-pdf     { width: 110px; }
.col-db      { width: 180px; }  /* truncated */
.col-url     { width: 220px; }  /* truncated */
.col-osf     { width: 160px; }  /* truncated */

/* Wrap vs truncate */
.wrap {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.abs-preview {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.none {
  color: #666;
  font-size: 0.9em;
}


/* Actions cell: lay out Edit + Delete cleanly with spacing */
.actions-stack {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

.actions-stack a,

.actions-stack button {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 4px;
  text-decoration: none;
  border: none;
  cursor: pointer;
}


/* Optional colors for clarity */
.actions-stack a.edit-btn     { background: #1f7338; color: #fff; }


/* END SECTION FOR EXISTING ARTICLES ON ADMIN PAGE */


.article-card {
    background: #fff;
    padding: 12px 15px;
    margin-bottom: 12px;
    border-radius: 6px;
    display: block;
}

/* Container for buttons + citation */
.article-header {
    display: flex;          
    align-items: flex-start; /* buttons stay top-aligned */
    gap: 8px;               
}

/* Citation + "Show Abstract" stacked vertically */
.article-meta-wrapper {
    display: flex;
    flex-direction: column;   
}

/* Metadata inline (citation) */
.article-meta-inline {
  font-size: 16px;
  color: #000;
  margin-bottom: 4px;
}

/* Abstract toggle link */
.show-abstract {
    font-size: 14px;
    color: #0066cc;
    cursor: pointer;
    margin-top: 4px;          
}

/* Abstract content */
.abstract {
    display: none;
    margin-top: 4px;
    padding: 8px;
    background: #f3f3f3;
    border-radius: 4px;
    font-size: 16px;
    max-width: 100%;
}

.small { font-size: 0.9em; color:#666; }
.error { color: #c00; }

.hidden { display: none !important; }



/* Buttons block */
.article-buttons {
    display: flex;
    gap: 3px;
}

/* Button wrapper ensures fixed width placeholder */
.btn-wrapper {
    min-width: 36px;
    display: flex;
    justify-content: center;
}

/* =========================
   SHARED BUTTON BASE
   ========================= */
.btn {
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 10px;
    line-height: 1;
    text-decoration: none;
    color: #fff;
    cursor: pointer;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Normalize real <button> elements only */
button.btn {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background-image: none;
}

/* =========================
   PUBLIC BUTTON COLORS
   ========================= */
.btn-pdf  { background: #04398f; }
.btn-link { background: #1f7338; }
.btn-osf  { background: #87670e; }

/* Placeholder (disabled-looking) */
.btn-placeholder {
    background: #ccc;
    color: #777;
    cursor: default;
    pointer-events: none;
}

/* =========================
   ADMIN BUTTONS
   ========================= */
.btn-edit {
    padding: 6px 10px;
    background: #162d60;
    font-size: 14px;
}

/* Explicitly scope anchor cleanup */
a.btn-edit {
    color: #fff;
    text-decoration: none;
}

/* Delete button */
button.btn-delete {
    background-color: #500;
    color: #fff;
    padding: 6px 12px;
    font-size: 14px;
}

button.btn-delete:hover {
    background-color: #800;
}

/* Inline admin form */
.inline-form {
    display: inline;
}



/* CAPTCHA overlay */
#captcha-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5000;
}

#captcha-box {
    background: #fff;
    padding: 20px;
    border-radius: 6px;
    width: 360px;
    max-width: 90%;
    text-align: center;
    box-shadow: 0 6px 18px rgba(0,0,0,0.18);
}

#captcha-box input[type="text"] { padding:6px; width: 85%; }
#captcha-box button { padding:6px 10px; margin: 4px; }