/* 
Theme Name: USYD Brand 
Theme URI: https://sydney.edu.au 
Author: USYD Wordpress Team 
Author URI: http://sydney.edu.au 
Description: University of Sydney branded theme 
Requires at least: 6.0 
Tested up to: 8.3 
Requires PHP: 8 
Version: 2.2.9 
License: GNU General Public License v2 or later 
License URI: http://www.gnu.org/licenses/gpl-2.0.html 
Text Domain: usyd-brand 
Tags: Site Editor */

.desktop_header_visit {
	background-color: var(--wp--preset--color--custom-master-black);
	padding: 0.44rem 20px;
}
.desktop_header_visit_text a {
	font-size:0.8rem;
	line-height:1.6;
	color:  var(--wp--preset--color--custom-white);
}
.desktop_header {
	padding-block:0;
	margin-block:0;
	border-bottom: 1px solid var(--wp--preset--color--custom-lite-grey);
}
.desktop_header_row {
	padding: 10px 15px;
}
.desktop_header_site_title {
font-size:2rem;
min-height:44px;
text-align:right;}

/* used on the border of the header */
.shadow_effect { 
    box-shadow: 0 4px 21px 0 rgba(0, 0, 0, 0.06); 
	margin-block: 0;
	background-color: var(--wp--preset--color--custom-white)
} 
.usyd-logo-block img { 
    padding: 10px; 
} 
.mobile_site_title_block {
	padding: 0.67rem 15px 0;
}
.mobile_site_title {
	font-size: 1.4rem;
	color: var(--wp--preset--color--custom-master-black);
	text-decoration:underline;
	text-decoration-thickness: 0.05em;
   text-underline-offset: 0.08em;

}
.mobile_header {
	padding-bottom: 15px;
}


/* remove the flex gap between the Site Title and the Site Tagline in the footer */ 
.no-gap{ 
    gap:3px !important 
} 
/* main menu navigation submenu styles */ 
.wp-block-navigation__submenu-container{ 
    background-color:var(--wp--preset--color--custom-lite-grey) !important; 
    border:0px !important; 
    min-width: 400px !important;     
} 

/* active menu item */ 
.current-menu-item { 
    text-decoration: underline; 
    text-decoration-color: var(--wp--preset--color--custom-link-hover);     
    text-underline-offset: 1rem; 
    text-decoration-thickness: 2px; 
} 
li.wp-block-navigation-item { 
        padding:15px !important; 
} 
li.wp-block-navigation-item:hover { 
    background-color: var(--wp--preset--color--custom-link-hover) ; 
    color: var(--wp--preset--color--custom-white); 
} 
@media screen and (max-width: 782px) {
	li.wp-block-navigation-item { 
        padding:5px !important; 
} 
	.wp-block-navigation__responsive-dialog { 
        padding:5px !important; 
} 

}

@media screen and (max-width:650px) {
		.wp-block-navigation__responsive-container-content {
	background-color:var(--wp--preset--color--custom-lite-grey) !important; 
}
}

/* keep nav menu on top */ 
.on-top{ 
    z-index:999; 
} 
/* set the top padding for anchor links so it doesn't get pushed under the sticky nav header */ 
html { 
 scroll-padding-top: 8rem; 
} 
/* controls the search field in the header */ 
.wp-block-search.wp-block-search__button-only .wp-block-search__button { 
 max-width: calc(100% - 0px) !important; 
} 
/* stops the browser user agent style for the outline when the search field has focus */ 
#wp-block-search__input-2, #wp-block-search__input-5{ 
    outline:0; 
} 

#myBtn { 
 display: none; 
 position: fixed; 
 bottom: 20px; 
 right: 30px; 
 z-index: 99; 
 font-size: 1.125rem; 
 border: none; 
 outline: none; 
 background-color:  var(--wp--preset--color--custom-link-hover); 
 color: var(--wp--preset--color--custom-white); 
 cursor: pointer; 
 padding: 15px; 
 border-radius: 4px; 
} 
#myBtn:hover { 
 background-color: #555; 
} 
#return-to-top { 
 position: fixed; 
 bottom: 40px; 
 right: 40px; 
 background: var(--wp--preset--color--custom-black); 
 color: whitesmoke; 
 text-align: center; 
 padding: 10px 15px; 
 font-size: 1.2rem; 
 text-decoration: none; 
 opacity: 0; 
 visibility: hidden; 
 transition: opacity 0.3s, visibility 0.3s; 
 z-index: 999; 
} 
#return-to-top:hover { 
 background: var(--wp--preset--color--custom-charcoal); 
} 
#return-to-top.show { 
 opacity: 1; 
 visibility: visible; 
} 

@media print {
  #return-to-top {
    display: none;
  }
}

/* Breadcrumbs styling.  */ 
.breadcrumbs { 
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
    background-color: var(--wp--preset--color--custom-shadow-grey); 
} 
.breadcrumbs li { 
    float:left; 
    padding:10px; 
    list-style-type: ">"; 
 } 

  :root {
	--container-width: 1200px; /* max width of the text in a page*/
    --columns-gap: var(--wp--style--columns-gap, 80px); 
  }

/* sets the maximum width for the content of the page. not including the header and footer. */ 
.container-fluid { 
 max-width: var(--container-width); 
 margin-right: auto; 
 margin-left: auto; 
	padding-left:10px;
	padding-right:10px;
} 


/*************************************/ 
@media screen and (max-width: 768px) { 
 .wp-block-post-featured-image { 
 width: 100% !important; 
 height: 350px ; 
 }     
.no-root-gutters .wp-block-column:not(:first-child) { 
 /* prevent residual padding on columns */ 
 padding-left: 0; 
 padding-right: 0; 
 } 
} 
/* device size for the header */ 

@media screen and (max-width: 650px) {
  /* Hide desktop-only elements */
  .desktop_header_visit,
  .desktop_header,
  .desktop_menu {
    display: none !important;
  }

  .make-row {
    flex-direction: row;
    justify-content: space-between;
  }

  /* Logo sizing for mobile */
  .usyd-logo-block img {
    width: 160px;
    height: auto;
  }
}

@media screen and (min-width: 651px){ 
    .mobile_header { 
 display: none !important; 
 }     
    .usyd-logo-block img { 
        width:200px ; 
        height: auto; 
    } 
}    
     
@media screen { 
    .printed-header { 
        display: none !important; 
    } 
} 

/* Print-only overrides */
@media print {
  /* Show the print-specific header, hide screen-only UI */
  .printed-header { 
    display: block; 
  }

  /* Elements that should not appear in print */
  .desktop_header_visit,
  .desktop_menu,
  .mobile_header,
  .screen_display {
    display: none;
  }

  /* Logo sizing for print */
  .usyd-logo-block img {
    width: 140px;
    height: auto;
  }

  :root {
    --wp--style--block-gap: 16px; /* smaller block gap prints better */
  }

  * {
    -webkit-print-color-adjust: exact; /* keep colours if needed */
    print-color-adjust: exact;         /* modern property */
  }

  .printed-header {
    break-inside: avoid;
    page-break-inside: avoid;
  }
}

/*-------------------------------------------
   Accessibility styling
---------------------------------------------*/
  .skip-link {
    position: absolute;
    left: 0.5rem;
    top: -100%;
    background: #000;
    color: #fff;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    font-size: 1rem;
    line-height: 1.5;
    z-index: 9999;
    text-decoration: none;
    /* Visually hidden but still available to screen readers until focused */
    transition: top 0.15s ease-in-out;
  }
  .skip-link:focus {
    top: 0.5rem;              /* Slide into view when focused */
    outline: 2px solid #fff;  /* High contrast focus ring */
    outline-offset: 2px;
  }

  /* Optional: ensure first element in header can be focused without layout shift */
  header[role="banner"] {
    position: relative;
  }


/* -------------------------------------------
   device size for the footer 
----------------------------------------------*/ 
.footer {
	margin:0;
	padding:0;
}
.footer_acknowledgement {
	background-color: var(--wp--preset--color--custom-ochra);
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.footer_acknowledgement_columns {
	padding-left: 15px;
	padding-right: 15px;
	gap: 0 !important;
}
.footer-col-1-align, .footer-col-2-align {
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.footer-col-2-align .usyd-logo-block img { 
 width: 233px; /* or whatever size you need */ 
 height: auto; 
} 
.acknowledgement_text {
	font-size: 1.25rem;
} 
.footer-learn-more a {
	font-size: 1.125rem;
	background-color: var(--wp--preset--color--custom-ochra);
	border:0;
	padding-left:0;
	padding-right:0;
	text-decoration:underline;
	text-decoration-thickness: 0.05em;
   text-underline-offset: 1em;
	
}

.footer-site-title {
	font-size:2rem;
}
.usyd_tagline {
	font-size: 2rem;
}
@media screen {
	.site_description a, .footer_links a {
		color: #ffffff !important;  }  
}

.site_description, .footer_links {
	background-color: var(--wp--preset--color--custom-master-black); 
	padding-top: 1.5rem;
	padding-bottom: 0.67rem;
	padding-right: 0;
	padding-left:0;
	margin-top:0;
	gap:0;
}
.site_description_row {
	padding-left:15px;
	padding-right:15px;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--wp--preset--color--custom-charcoal); 
	color: var(--wp--preset--color--custom-white);
}
p.site_description_row {
	font-size:.8rem;}
.usyd_link a {
	color: var(--wp--preset--color--custom-white);}

.footer_links_columns {
	padding-left: 15px;
	padding-right: 15px;
}
.footer_links a {
	color:  var(--wp--preset--color--custom-white);
}
.abn-dets { 
    gap: 10px !important;
	font-size:0.625rem;
color: var(--wp--preset--color--custom-white);
} 
.print_fields_text {
	font-size:0.625rem;
	gap:3px;
	border-top: 1px solid var(--wp--preset--color--custom-lite-grey);
}

@media screen and (max-width: 800px) { 
        .footer-border { 
        border-right: none; 
        padding-right:0; 
    } 
    .footer-col-1-align { 
        text-align: center; 
    } 
    .footer-col-2-align { 
        text-align:center; 
    } 
    .footer-learn-more { 
        margin:auto !important;         
    } 
    .footer-links p { 
        flex-direction: column; 
         gap: 3px; 
        align-items: start !important; 
		font-size:0.625rem;
    } 
    .abn-dets { 
        align-items: start !important; 
    } 
} 
@media only screen and (min-width: 801px){ 
    .footer-border { 
    border-right: 1px solid var(--wp--preset--color--custom-text-black); 
    padding-right:10%; 
    }     
    .footer-col-2-align { 
        text-align:right; 
    } 
    .align-logo { 
        margin-right:5%; 
    } 
    .abn-dets { 
        padding-left:35%; 
    } 
} 

/*-----------------------END FOOTER------------*/


/*-------------------------------------

  WordPress Core blocks Control Styles

---------------------------------------*/
/* Ensure WordPress layout wrappers actually use the block gap variable */ 
.is-layout-flex, 
.is-layout-flow, 
.is-layout-constrained, 
.wp-block-group { 
 gap: var(--wp--style--block-gap, 32px); 
} 
/* For column-based layouts, enforce horizontal column-gap too */ 
.wp-block-columns { 
 column-gap: var(--columns-gap);
} 

/* If any inner Groups inherit padding, normalize them too */ 
.no-root-gutters, .no-root-gutters .wp-block-group { 
 padding-left: 0; 
 padding-right: 0; 
} 
.wp-post-image { 
 width: 100%; 
 height: 350px; 
 object-fit: cover; 
 display: block; 
} 
.wp-block-separator { 
 width: 50%; 
 display: block; 
} 
ul li { 
    list-style-type: '\2014'; 
} 
li { 
    padding-bottom: 1rem; 
    padding-left:1.2rem; 
} 
.post_nav_separator { 
    width: 100% !important; 
	display: block;
} 

.wp-block-post-template li{ 
    list-style-type:none; 
} 

/*style the accordion toggle detail block */ 
.wp-block-details summary { 
    font-size:1.2rem; 
 font-weight: 900; 
 text-decoration: underline;} 

.wp-block-details summary::after { 
    content: '+'; 
    color:var(--wp--preset--color--custom-ochra); 
    float:right; 
    font-size: 2.5rem; 
font-weight:400;} 

.wp-block-details summary::marker{ 
    content: none ;} 
/* end detail block style */ 

/*table design formatting */ 
table, th, td { 
 border: #ced4da 1px solid !important; 
 padding: 10px; 
} 
tr:nth-child(odd) { 
 background-color: #E7E7E8; 
} 
table { 
 border-collapse: collapse; 
} 
th { 
    background-color: var(--wp--preset--color--custom-charcoal); 
    color: var(--wp--preset--color--custom-white); 
} 

/*---------------------------------------------------
    TEMPLATE Styles
---------------------------------------------------*/

/* Replace inline margin-top/bottom from the template's <main> */
.container-fluid.wp-block-group {
  margin-top: 0;
	margin-bottom: 0;}


/* Featured image presentation for the hero at the top of posts and pages*/
.post-featured-hero img {
  width: 100%;
  height: 350px;      
  object-fit: cover;
  display: block;
  border-radius: 0;  
}


/* Column widths used in the single post template */
.wp-block-columns .col-left  { flex-basis: 20%; }
.wp-block-columns .col-main  { flex-basis: 60%; }
.wp-block-columns .col-right { flex-basis: 20%; }

@media screen and (max-width:782px){
  /* Adjust flex layouts for mobile */
  .mobile-reverse-column-direction {
    flex-direction: column-reverse;
  }
}

/* Post title display settings (replaces inline fontWeight/padding) */
h1.wp-block-post-title {
  font-weight: 600;
  padding-top: 0;
	padding-bottom: 0;}

/* All topics heading in archives */
.topics-heading {
  font-weight: 600;
  font-size: 1.125rem;
}

/* the post categories list on the single posts template and archive templates*/ 
.post_nav_cats {         
    padding-inline-start: 10px; 
} 
.post_nav_cats li { 
    list-style-type: none; 
    line-height: 2; 
    padding-left: 5px; 
} 

.post_nav_cats li a {
  line-height: 1.4;       
  display: inline-block;  
}

ul.children {
	padding-left:15px;
}
.post_date_display::before { 
    content: "Date created "; 
} 
.post_date_modified_display::before { 
    content: "Date modified "; 
} 
	
/* Dates group: keep the inline flex layout behavior via CSS */
.post-dates {
  display: flex;
  flex-wrap: nowrap;
	gap: var(--wp--style--block-gap, 32px);}


/* Post Grid */
.post-template-card li {
	padding:1rem;
}


/* create a hover overlay on the blog post feature image */ 
.hover-opacity:hover{      
    opacity:0.6; 
    filter:alpha(opacity=60); /* For IE8 and earlier */ 
    -webkit-transition: all 1s ease; 
    -moz-transition: all 1s ease; 
    -ms-transition: all 1s ease; 
    -o-transition: all 1s ease; 
    transition: all 1s ease; 
} 

.post-card {
    background-color: var(--wp--preset--color--custom-shadow-grey);
    padding: 1rem;
	margin:0;
	gap: 10px;
}

.post-card .wp-block-post-title a {
    color: var(--wp--preset--color--custom-master-black);
}

.post-card .wp-block-post-title a:hover {
    color: var(--wp--preset--color--custom-link-hover);
}

@media screen and (max-width:650px) {
	.post-template-card li {
	padding:0;
	}}


/* ===============================
   Base (shared with Style 1)
   =============================== */
.hero-page-main { margin-top: 0; margin-bottom: 0; }
.no-root-gutters { padding-left: 0; padding-right: 0; }

/* Shared typography tokens for titles/excerpts */
.m-hero__title,
.m-hero--style-1__title,
.m-hero--style-2__title {
  font-weight: 600;
  font-size: 4rem;
}

.m-hero__excerpt,
.m-hero--style-1__excerpt,
.m-hero--style-2__excerpt {
  font-size: 1.5rem;
}

.m-hero--style-1__title,
.m-hero--style-1__excerpt {
  color: var(--wp--preset--color--white);
}

.m-hero--style-1__wrapper {
	 border-bottom: 5px solid var(--wp--preset--color--custom-ochra);
}
.m-hero__inner {
	padding-top: 20vh;
	min-height: 70vh;
}
@media screen and (min-width: 801px) {
.m-hero__inner {
	padding-right:20% !important;
}
}

@media screen and (max-width: 800px) {
  .m-hero__title,
  .m-hero--style-1__title
   {
    font-size: 2rem !important;
  }
	.m-hero__inner {
	padding-right:0;
}
}

/* ===============================
   Half Hero (Style 2) specifics
   =============================== */
.half-hero-column-container {
	max-width: 100%;
}
.half-hero-title-container {
	width: calc(var(--container-width) / 2 - var(--columns-gap));
	margin-left: auto;
	margin-right:20px;
}

.half-hero-page-title {	
	padding-top: 20vh;
}

/* Title & excerpt are "template black" */
.m-hero--style-2__title,
.m-hero--style-2__excerpt {
  color: var(--wp--preset--color--black);
}


/* Featured image should be 70vh and cover its column */
.half-hero-featured img {
  height: 70vh;
  width: 100%;
  object-fit: cover;
  display: block;
}


@media screen and (max-width: 650px) {
  .half-hero-page-title {
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 10%;
  }
	.half-hero-title-container {
	width: 100%;
	margin-left: 10px;
	margin-right:20px;
}
	.half-hero-featured {
  height: auto !important;
  width: 100%;
}
	.m-hero--style-2__title {
    font-size: 2rem !important;
  }
}
@media screen and (min-width: 651px) and (max-width: 782px) {
	 .half-hero-page-title {
    padding-left: 20px;
    padding-right: 25px;
    padding-top: 25px;
  }
		.half-hero-title-container {
	width: 100%;
	margin-left: 0px;
	margin-right:0px;
}
		.half-hero-featured {
  height: auto !important;
  width: 100%;
}
	.m-hero--style-2__title {
    font-size: 3rem !important;
  }
}
	@media screen and (min-width: 783px) and (max-width:1035px) {
		.m-hero--style-2__title {
    font-size: 3.38rem !important;
  }
		.half-hero-title-container {
			width: 50vw;
	margin-left: auto;
	margin-right:20px;
		}
	}


/*---------------------------------------------
*         BLOCKS Styles 
-----------------------------------------------*/ 

.usyd-full-width-background { 
 width: 100vw; 
 margin-left: calc(-50vw + 50%); 
 position: relative; 
 box-sizing: border-box; 
} 
.usyd-full-width-background .container-fluid { 
 max-width: 1200px; 
 margin: 0 auto; 
} 
.usyd-icon-picker-dropdown { 
 max-width: 200px; 
 width: 100%; 
} 
.usyd-icon-grid { 
 display: grid; 
 grid-template-columns: repeat(3, 1fr); 
 gap: 12px; 
 margin-top: 10px; 
} 
.usyd-icon-item.selected { 
 box-shadow: 0 0 5px #007cba; 
} 
.icon-small { width: 24px; height: 24px; } 
.icon-medium { width: 48px; height: 48px; } 
.icon-large { width: 72px; height: 72px; } 
.icon-extra-large { width: 96px; height: 96px; }


/*-----------------------------------POST grid stuff*/

/* Main container */
.main--no-top-margin { margin-top: 0; }

/* Title section */
.title-section {
  padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--50);
}
.title-separator .wp-block-separator {
  margin-bottom: var(--wp--preset--spacing--40);
}

/* Columns */
.sidebar { flex-basis: 20%; }
.main-content { flex-basis: 80%; }

/* Spacers */
.spacer-50 { height: 50px; }
.spacer-40 { height: var(--wp--preset--spacing--40); }

/* Post grid */
.post-grid { display: grid; gap: var(--wp--preset--spacing--50); }

/* Post card */
.post-card-body {
  background-color: #f1f1f1;
  padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Post title */
.post-title {
  font-size: 1.4rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--wp--preset--color--custom-master-black);
}
.post-title a:hover,
.post-title a:focus {
  color: var(--wp--preset--color--custom-link-hover);
  text-decoration: underline;
}

/* Post meta */
.post-meta {
  display: flex;
  gap: 3px;
  align-items: center;
}

/* Pagination */
.pagination .wp-block-query-pagination {
  display: flex;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--30);
}