/* =========================================
   Myera Rashid Academic Website
   ========================================= */

:root {

  /* Brighter green */
  --green: #00563B;
  --green-dark: #00452f;

  --text: #292929;
  --muted: #707070;
  --light-muted: #8a8a8a;

  --background: #ffffff;

  --rule: #e5e5e5;
  --heading-rule: #cfcfcf;
  --paper-rule: #eeeeee;
}


/* =========================================
   BASIC RESET
   ========================================= */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;

  background: var(--background);
  color: var(--text);

  font-family:
    Georgia,
    "Times New Roman",
    Times,
    serif;

  font-size: 15px;
  line-height: 1.55;
}


/* =========================================
   MANUAL TEXT CLASSES
   ========================================= */

/* Green text */
.green-text {
  color: var(--green);
}


/* Gray text */
.gray-text {
  color: var(--muted);
}


/* Lighter gray text */
.light-gray-text {
  color: var(--light-muted);
}


/* Italic text */
.italic-text {
  font-style: italic;
}


/* Bold text */
.bold-text {
  font-weight: 700;
}


/* Smaller text */
.small-text {
  font-size: 13px;
}


/* Put something on a new line */
.new-line {
  display: block;
}


/* =========================================
   LINKS
   ========================================= */

/*
   By default, all links are underlined.
*/

a {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}


main a {
  color: var(--green);
}


main a:hover {
  color: var(--green-dark);
}


/* =========================================
   MAIN PAGE WIDTH
   ========================================= */

.page {
  width: min(100% - 44px, 900px);
  margin: 0 auto;
}


/* =========================================
   HEADER / NAVIGATION
   ========================================= */

.site-header {
  display: flex;
  justify-content: flex-start;
  align-items: center;

  padding: 28px 0 19px;
  margin-bottom: 38px;

  border-bottom: 1px solid var(--rule);
}


/* Larger name */

.site-name {
  color: var(--green);

  font-size: 22px;
  font-weight: 700;
}


/* Research and CV sit near name */

.site-nav {
  display: flex;

  gap: 31px;
  margin-left: 55px;
}


/* Larger Research / CV */

.site-nav a {
  color: var(--text);

  font-size: 18px;
  font-weight: 400;
}


.site-name:hover,
.site-nav a:hover {
  color: var(--green-dark);
}


/* =========================================
   HOMEPAGE INTRODUCTION
   ========================================= */

.home-layout {
  display: grid;

  grid-template-columns: 215px minmax(0, 1fr);

  gap: 46px;
  align-items: start;

  margin: 0;
  padding: 0;
}


.home-photo img {
  display: block;

  width: 100%;
  height: auto;

  border-radius: 2px;
}


.home-text {
  max-width: 600px;
}


.home-text p {
  margin: 0 0 14px;
}


/* =========================================
   HOMEPAGE RESEARCH PAPERS
   ========================================= */

/*
   Creates the horizontal line and space
   between your introduction and Research Papers.
*/

.front-papers {
  margin-top: 46px;
  padding-top: 28px;

  border-top: 1px solid var(--rule);
}


/* Research Papers heading */

.front-papers h2 {
  display: inline-block;

  margin: 0 0 22px;
  padding-bottom: 3px;

  color: var(--text);

  font-size: 18px;
  line-height: 1.35;
  font-weight: 600;

  border-bottom: 1px solid var(--heading-rule);
}


/* Individual homepage papers */

.front-paper {
  margin: 0;
  padding: 0;
}


.front-paper + .front-paper {
  margin-top: 18px;
}


/* Homepage paper titles */

.front-paper-title {
  margin: 0 0 2px;

  color: var(--text);

  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
}


/*
   Keep homepage paper titles on one line
   on regular desktop screens.
*/

@media (min-width: 701px) {

  .front-paper-title {
    white-space: nowrap;
  }

}


/*
   Homepage paper-title links look like
   ordinary black text until you hover.
*/

.front-paper-title a {
  color: var(--text);

  text-decoration: none;
}


.front-paper-title a:hover {
  color: var(--green);

  text-decoration: underline;
  text-underline-offset: 2px;
}


/*
   Black information immediately below
   homepage paper titles.
*/

.front-paper-info {
  margin: 2px 0;

  color: var(--text);

  font-size: 13px;
  line-height: 1.45;
}


/*
   Homepage coauthor lines.
*/

.front-paper-authors {
  margin: 2px 0;

  color: var(--muted);

  font-size: 13px;
  line-height: 1.45;
}


/*
   JMP Draft Coming Soon on separate line.
*/

.front-paper-coming-soon {
  margin: 1px 0 0;

  color: var(--light-muted);

  font-size: 13px;
  font-style: italic;
}


/*
   Draft Coming Soon inside parentheses,
   e.g. Immigrant Advantage.
*/

.front-inline-coming-soon {
  color: var(--light-muted);

  font-style: italic;
}


/* =========================================
   MAIN CONTENT
   ========================================= */

main {
  padding-bottom: 65px;
}


/* =========================================
   RESEARCH PAGE TITLE
   ========================================= */

main > h1 {
  margin: 0 0 31px;

  color: var(--text);

  text-align: center;

  font-size: 22px;
  line-height: 1.3;
  font-weight: 600;
}


/* =========================================
   RESEARCH SECTIONS
   ========================================= */

.research-section {
  margin: 0 0 34px;

  padding-top: 23px;

  border-top: 1px solid var(--rule);
}


/*
   No horizontal line directly below
   the main Research heading.
*/

.research-section.first-section {
  padding-top: 0;

  border-top: none;
}


/*
   Working Papers / Publications /
   Selected Works in Progress /
   Published Dataset
*/

.research-section h2 {
  display: inline-block;

  margin: 0 0 21px;
  padding-bottom: 3px;

  color: var(--text);

  font-size: 18px;
  line-height: 1.35;
  font-weight: 600;

  border-bottom: 1px solid var(--heading-rule);
}


/* =========================================
   INDIVIDUAL RESEARCH PAPERS
   ========================================= */

.paper {
  margin: 0;
  padding: 0;
}


/*
   Faint divider between papers.
*/

.paper + .paper {
  margin-top: 23px;
  padding-top: 23px;

  border-top: 1px solid var(--paper-rule);
}


/*
   No divider between papers in
   Selected Works in Progress.
*/

.no-paper-dividers .paper + .paper {
  margin-top: 18px;
  padding-top: 0;

  border-top: none;
}


/* =========================================
   RESEARCH PAPER TITLES
   ========================================= */

.paper h3 {
  margin: 0 0 4px;

  color: var(--text);

  font-size: 16px;
  line-height: 1.4;
  font-weight: 600;
}


/*
   Linked paper titles on Research page
   are green and underlined.
*/

.paper h3 a {
  color: var(--green);
}


.paper h3 a:hover {
  color: var(--green-dark);
}


/* =========================================
   SPACING WITHIN PAPERS
   ========================================= */

.paper p {
  margin: 4px 0;
}


/* =========================================
   PAPER METADATA
   ========================================= */

.paper-meta {
  color: var(--muted);

  font-size: 14px;
  line-height: 1.5;
}


/*
   Abstract / Presentations / Featured in.
*/

.paper-detail {
  color: var(--muted);

  font-size: 13px;
  line-height: 1.55;
}


/* =========================================
   REVISE & RESUBMIT / PUBLICATION STATUS
   ========================================= */

/*
   Black and same size as Draft links.
*/

.paper-status {
  margin: 3px 0;

  color: var(--text);

  font-size: 16px;
  line-height: 1.4;
}


/* =========================================
   DRAFT / NBER / CEPR / PUBLISHED LINKS
   ========================================= */

.paper-links {
  margin: 4px 0;

  font-size: 13px;
  line-height: 1.5;
}


/* =========================================
   COAUTHOR LINKS
   ========================================= */

/*
   Coauthors are gray and underlined normally.
   They turn green when hovered.
*/

.coauthor {
  color: var(--muted) !important;
}


.coauthor:hover {
  color: var(--green) !important;
}


/* =========================================
   ABSTRACTS
   ========================================= */

.abstract-content {
  width: 100%;
  max-width: none;

  margin-top: 10px;
  margin-bottom: 10px;

  color: var(--muted);

  font-size: 13px;
  line-height: 1.55;
}


/* =========================================
   JOB MARKET PAPER
   ========================================= */

.jmp-title {
  color: var(--green) !important;
}


.jmp-status {
  margin: 4px 0 0;
}


/*
   "Job Market Paper;"
*/

.jmp-label {
  display: block;

  color: var(--text);

  font-size: 13px;
  font-style: normal;
  font-weight: 600;
}


/* =========================================
   OTHER GREEN TITLES
   ========================================= */

.green-title {
  color: var(--green) !important;
}


/* =========================================
   JOURNALS
   ========================================= */

.journal {
  color: var(--green);
  font-weight: 600;
}


/* =========================================
   DRAFT COMING SOON
   ========================================= */

.coming-soon {
  display: block;

  margin: 1px 0 0;

  color: var(--light-muted);

  font-size: 13px;
  font-style: italic;
}


/* =========================================
   DATASET PRIZE
   ========================================= */

.dataset-prize {
  margin: 4px 0 0;

  color: var(--muted);

  font-size: 13px;
  line-height: 1.5;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 700px) {

  .page {
    width: min(100% - 32px, 900px);
  }


  .site-header {
    padding-top: 21px;
    margin-bottom: 30px;
  }


  .site-nav {
    margin-left: 35px;
    gap: 20px;
  }


  .home-layout {
    grid-template-columns: 1fr;
    gap: 26px;
  }


  .home-photo {
    max-width: 210px;
  }


  .home-text {
    max-width: none;
  }


  main > h1 {
    font-size: 21px;
  }


  /*
     Allow long homepage paper titles
     to wrap on phones/tablets.
  */

  .front-paper-title {
    white-space: normal;
  }

}


/* =========================================
   SMALL SCREENS
   ========================================= */

@media (max-width: 460px) {

  body {
    font-size: 14px;
  }


  .site-name {
    font-size: 18px;
  }


  .site-nav {
    margin-left: 24px;
    gap: 15px;
  }


  .site-nav a {
    font-size: 15px;
  }


  .paper h3 {
    font-size: 15px;
  }


  .research-section h2 {
    font-size: 17px;
  }


  .front-paper-title {
    font-size: 14px;
  }

   .paper-status {
  font-size: 15px;
}

}



/* =========================================
   TEACHING PAGE
   ========================================= */

.teaching-page {
  padding-bottom: 65px;
}


/* Main Teaching title */

.teaching-page > h1 {
  margin: 0 0 31px;

  color: var(--text);

  text-align: center;

  font-size: 22px;
  line-height: 1.3;
  font-weight: 600;
}


/* Teaching sections */

.teaching-section {
  margin-bottom: 30px;
}


/* Bold + underlined section headings */

.teaching-heading {
  margin: 0 0 14px;

  color: var(--text);

  font-size: 16px;
  line-height: 1.4;
  font-weight: 700;

  text-decoration: underline;
  text-underline-offset: 3px;
}


/* Paragraph spacing */

.teaching-section p {
  margin: 7px 0;

  color: var(--text);

  font-size: 15px;
  line-height: 1.55;
}


/* Teaching links */

.teaching-section a {
  color: var(--green);

  text-decoration: underline;
  text-underline-offset: 2px;
}


.teaching-section a:hover {
  color: var(--green-dark);
}


/* Mobile */

@media (max-width: 700px) {

  .teaching-page > h1 {
    font-size: 21px;
  }

}


@media (max-width: 460px) {

  .teaching-heading {
    font-size: 15px;
  }

  .teaching-section p {
    font-size: 14px;
  }

}