/*
 Theme Name:   Shropshire, Telford & Wrekin LMC
 Author:       Hurrell IT and Networking Ltd.
 Template:     Divi
 Version:      1.0.0
*/

/*****Add any custom CSS below this line*****/

/***** START - Link styles *****/

/* Set body links: use underline */ 
.et_pb_text_inner a {
	text-decoration: underline;
}
/* Set H1 heading in News page to use underline */ 
.entry-title a {
	text-decoration: underline !important;
}

/* Set H1 heading in News page to use standard link blue */ 
.entry-title a {
	color: #2EA3F2 !important;
}

/* Set links in blog post boxes to correct style */ 
.post-content a {
	text-decoration: underline !important;
	color: #2EA3F2 !important;
}

.post-content a:hover {
	text-decoration: none !important;
	color: #7C2855 !important;
}

.post-content a:focus {
	background-color: #ffeb3b !important;
	box-shadow: 0px 3px black !important;
	text-decoration: none !important;
}

.post-content a:visited {
	color: #330072 !important;
}

/* Set links in drop down menu to no underline */
.et-menu a {
  text-decoration: none !important;
}

/* Set background hover color of links in drop down menu */
.nav ul li a:hover {
	background-color: #DBDBDB !important;
}

/* Set links in toggles to underline */
.et_pb_toggle_content a {
	text-decoration: underline !important;
}

.et_pb_toggle_content a:hover {
	text-decoration: none !important;
	color: #7C2855 !important;
}

.et_pb_toggle_content a:focus {
	background-color: #ffeb3b !important;
	box-shadow: 0px 3px black !important;
	text-decoration: none !important;
}

/* Set body hover: remove underline and change colour */
.et_pb_text_inner a:hover {
	text-decoration: none;
	color: #7C2855;
}

/* Set H1 heading in News page hover: remove underline and change colour */

.entry-title a:hover {
	text-decoration: none !important;
	color: #7C2855 !important;
}

/* Set body focus: use NHS style yellow background, black line, remove underline */
.et_pb_text_inner a:focus {
	background-color: #ffeb3b;
	box-shadow: 0px 3px black;
	text-decoration: none;
}

/* Set H1 heading in News page hover: use NHS style yellow background, black line, remove underline */
.entry-title a:focus {
	background-color: #ffeb3b !important;
	box-shadow: 0px 3px black !important;
	text-decoration: none !important;
}

/* Set body visited: use NHS style purple */
.et_pb_text_inner a:visited {
  color: #330072 !important;
}

/* Set link styles for TOC */

#ez-toc-container a {
	text-decoration: underline !important;
	color: #2ea3f2 !important;
}

#ez-toc-container a:hover {
	text-decoration: none !important;
	color: #7C2855 !important;
}

#ez-toc-container a:visited {
  color: #330072 !important;
}

/* Set menu hover: use underline, reset opacity from default 0.7 */
.et_pb_menu_0_tb_header.et_pb_menu ul li a:hover {
	text-decoration: underline !important;
	/*opacity: 1;*/
}

/* apply style to the active top level menu item via CSS class in item */
.pa-active-menu-item .et-menu-nav>ul>li.current-menu-item>a {
	border-bottom: 3px solid #ffeb3b !important;
}
/***** END *****/

/***** START - color styles *****/
/* Set color of H2 header in home page */
.et_pb_bg_layout_dark h2 {
	/*background-color: #0476BE;*/
	padding-bottom: 10px;
	padding-top: 10px;
}

/* Set color of post body text to override default grey */
.post-content p {
	color: #212b32 !important;
}

/***** END *****/

/***** START - heading styles *****/
/* Override padding */

h1, h2, h3, h4, h5, h6 {
    padding-bottom: 30px;
}

/***** END *****/


/***** START - font size styles *****/
/* Set post meta to 14px */
.post-meta {
    font-size: 14px !important;
}

/***** END *****/

/***** START - Yoast Breadcumbs *****/
/* Style Yoast breadcrumbs via CSS class in item */
.pa-breadcrumb {
	font-size: 24px;
}
/***** END *****/

/***** START - Divi Menu *****/
/* Fix issue on Divi Menu which won't center on mobile/tablet */
@media (max-width: 980px) {
  .et_pb_menu--style-left_aligned .et_pb_menu__wrap {
    justify-content: center;
  }
}
/***** END *****/

/* START - Prevent footer menu from changing to hamburger on mobile/tablet */
.pa-mobile-menu-hide.et_pb_menu .et_pb_menu__menu,.lwp-hide-mobile-menu.et_pb_fullwidth_menu .et_pb_menu__menu {
    display: flex!important;
}
 
.pa-mobile-menu-hide .et_mobile_nav_menu {
    display: none;
}
/* END */

/***** START - Add styling for Accessibility and Immersive Reader buttons in header - pa-inline-buttons is defined on the row in the global header *****/

/* place button modules next to each other in the same column */
.pa-inline-buttons .et_pb_button_module_wrapper {
    display: inline-block;
}

/* align the buttons to the right */
.pa-inline-buttons {
    text-align: right !important;
}

/* align the buttons to center under 800px wide */
@media (max-width: 800px) {
.pa-inline-buttons {
    text-align: center !important;
	}
}
/* END */

/***** START - Add styling for indented bullets and numbered lists *****/

.entry-content ol, .entry-content ul {
    padding: 0px 0px 0px 50px;
    list-style-position: outside;
}
 
.entry-content ol li, .entry-content ul li {
    margin-bottom: 10px;
}

/* END */

/***** START - Add styling for YouTube embeds *****/

/* Add rounded corners and border */
.fluid-width-video-wrapper iframe {
/*.br-loaded {*/
	border-radius: 10px!important;
	border: 2px solid #01468B;
}

/* END */

/***** Add styling for images in toggles *****/

/* Add rounded corners and border */
.bio {
	border-radius: 10px!important;
	border: 2px solid #01468B;
}

/* END */

/***** START - Add styling for toggles *****/

.et_pb_toggle_title {
	margin-left: -20px;
    margin-right: -20px;
    margin-top: -20px;
    margin-bottom: -20px;
    padding: 20px!important;
    background: #01468B!important;
}
.et_pb_toggle_title:before {
    right: 10px!important;
}

.et_pb_toggle_content {
  padding-top: 40px;
}

.et_pb_toggle_0.et_pb_toggle, .et_pb_toggle_1.et_pb_toggle, .et_pb_toggle_2.et_pb_toggle, .et_pb_toggle_3.et_pb_toggle,  .et_pb_toggle_4.et_pb_toggle, .et_pb_toggle_5.et_pb_toggle, .et_pb_toggle_6.et_pb_toggle, .et_pb_toggle_7.et_pb_toggle, .et_pb_toggle_8.et_pb_toggle, .et_pb_toggle_9.et_pb_toggle, .et_pb_toggle_10.et_pb_toggle, .et_pb_toggle_11.et_pb_toggle, .et_pb_toggle_12.et_pb_toggle {
  background-color: transparent!important;
}

.et_pb_toggle_0.et_pb_toggle, .et_pb_toggle_1.et_pb_toggle, .et_pb_toggle_2.et_pb_toggle, .et_pb_toggle_3.et_pb_toggle,  .et_pb_toggle_4.et_pb_toggle, .et_pb_toggle_5.et_pb_toggle, .et_pb_toggle_6.et_pb_toggle, .et_pb_toggle_7.et_pb_toggle, .et_pb_toggle_8.et_pb_toggle, .et_pb_toggle_9.et_pb_toggle, .et_pb_toggle_10.et_pb_toggle, .et_pb_toggle_11.et_pb_toggle, .et_pb_toggle_12.et_pb_toggle {
  background-color: transparent!important;
}

.et_pb_toggle_content p:last-of-type {
    padding-bottom: 1em;
}

/* END */

/***** START - Add specific CSS for stacking columns on mobile - used to ensure the TOC is first. Add the CSS to the column in the row you want *****/

@media all and (max-width: 980px) {
/* wrap row in a flex box */
.custom_row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
-webkit-flex-wrap: wrap; /* Safari 6.1+ */
flex-wrap: wrap;
}
 
/* custom classes that will designate the order of columns in the flex box row */
.first-on-mobile {
-webkit-order: 1;
order: 1;
}
 
.second-on-mobile {
-webkit-order: 2;
order: 2;
}
 
.third-on-mobile {
-webkit-order: 3;
order: 3;
}
 
.fourth-on-mobile {
-webkit-order: 4;
order: 4;
}
	
/* add margin to last column */
.custom_row:last-child .et_pb_column:last-child {
margin-bottom: 30px;
}

}	
/* END */

/***** START - Override the hardcoded H1 font size for rows with multiple columns - for when the overall H1 size has been changed at global level *****/
.et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 {
    font-size: 30px;
}
/* END */


/***** START - Style for gTranslate slector *****/

/* Float the selector to the right */
.gtranslate_wrapper {
	float: right;
}

/* END */


/***** START - Resources cards *****/

  /* ─── Individual Card ─── */
  .card {
    background: #faf9f7;
    border: 1.5px solid #ddd8d0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(27,42,74,.08);
    padding: 22px 20px 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: box-shadow .25s, transform .25s, border-color .25s;
    position: relative;
	height: 250px;  
  }

  /* PDF icon badge */
  .card-icon {
    width: 42px; height: 42px;
    border-radius: 8px;
    background: linear-gradient(135deg, #e8f5f3 0%, #d4eeeb 100%);
    display: flex; align-items: center; justify-content: center;
  }
  .card-icon svg {
	  width: 22px;
	  height: 22px;
	  color: #0D8EAE;
  }
  .card-body {
	  flex: 1; 
	  display: flex;
	  flex-direction: column;
	  gap: 5px;
  }
  .card-title {
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.35;
  }
  .card-desc {
    font-size: .82rem;
    color: #5a6270;
    line-height: 1.5;
  }
  .card-meta {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
    border-top: 1px solid #ddd8d0;
  }
  .card-date {
    font-size: .76rem;
    color: #8a8f99;
  }

  /* Download button */
  .btn-download {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #01468B;
    color: #fff;
    font-family: inherit;
    font-size: .8rem;
    font-weight: 600;
    padding: 6px 14px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, transform .15s;
    letter-spacing: .02em;
  }
  .btn-download:hover {
	  background: #0476BE;
	  transform: scale(1.03);
  }
  .btn-download svg {
	  width: 13px;
	  height: 13px;
  }

/* END */