:root{--color-primary:#69bd45;--color-secondary:#007ab8;--color-tertiary:#1ea4a9;--color-state:#4b7e2b;--color-state-hover:#3c6721;--color-state-focus:#3c6721;--color-state-active:#30541a;--color-state-highlight:#f6f9d7;--color-state-highlight-neutral:var(--color-neutral-3);--color-state-disabled:var(--color-neutral-5);--color-neutral-1:#fff;--color-neutral-2:#fafafa;--color-neutral-3:#f7f7f7;--color-neutral-4:#e6e4e4;--color-neutral-5:#c7c7c7;--color-neutral-6:#767676;--color-neutral-7:#262626;--color-background:var(--color-neutral-1);--color-border:var(--color-neutral-5);--color-text:var(--color-neutral-7);--color-text-disabled:var(--color-neutral-5);--color-text-hint:var(--color-neutral-6);--link-color:var(--color-state);--link-color-hover:var(--color-state-hover);--nav-bg-color:#fff;--nav-text-color:var(--color-text);--footer-bg-color:#fff;--footer-text-color:var(--color-text);--footer-text-color-hover:var(--footer-text-color);--btn-accent-color:var(--color-state);--btn-accent-color-active:var(--color-state-active);--btn-accent-color-focus:var(--color-state-focus);--btn-accent-color-disabled:var(--color-state-disabled);--btn-prim-accent-color:var(--color-state);--btn-prim-accent-color-active:var(--color-state-active);--btn-prim-accent-color-focus:var(--color-state-focus);--btn-prim-accent-color-disabled:var(--color-state-disabled)}:root{--nav-bg-color: #ffffff;--nav-text-color: #003d62;--color-primary: #0a3c64;--color-state: #0a3c64;--color-text: #003d62;--footer-bg-color: #ffffff;--footer-text-color: #003d62;--color-state-hover: #00325a;--color-state-focus: #00325a;--color-state-active: #002149;--footer-text-color-hover: #003358;}
/* ==========================================================================
   Drinkaware Additional CSS
   ========================================================================== */

/* ==========================================================================
   Carousel
   ========================================================================== */
.carousel .carousel-inner > .item .carousel-caption {
    color:#003d62;
    font-size:36px;
}

/* ==========================================================================
   Featured Links overlay colour
   ========================================================================== */
.block-totara-featured-links-layout .block-totara-featured-links-content::before {
    background: rgba(12,60,99,0.6);
}

/* ==========================================================================
   Footer Styles – Drinkaware implementation
   Author: Jeremy
   ========================================================================== */
.page-footer {
  background-color: #f8f8f8;
  padding: 2rem 1rem;
  font-family: Arial, sans-serif;
  color: #333;
}

.page-footer-main-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.lowerLinks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;
}

.lowerLinks li a {
  font-size: 16px;
  color: #333;
  text-decoration: none;
  transition: color 0.2s ease-in-out;
}
.lowerLinks li a:hover,
.lowerLinks li a:focus {
  color: #5b2c83;
  text-decoration: underline;
}

.socialLinks {
  list-style: none;
  margin: 0;
  padding: 1rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
}
.socialLinks li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #5b2c83;
  transition: background-color 0.2s ease-in-out, opacity 0.2s ease-in-out;
}
.socialLinks li a i {
  font-size: 20px;
  color: #fff;
}
.socialLinks li a:hover,
.socialLinks li a:focus {
  background-color: #4a216e;
  opacity: 0.95;
}

.copyright {
  font-size: 0.9rem;
  color: #666;
  text-align: center;
  max-width: 900px;
  line-height: 1.4;
}

.page-footer-poweredby,
.purgecaches {
  font-size: 0.8rem;
  text-align: center;
}
.page-footer-poweredby a,
.purgecaches a {
  font-size: 16px;
  color: #5b2c83;
  text-decoration: none;
}
.page-footer-poweredby a:hover,
.purgecaches a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   Drinkaware Login – Layout & Styling
   Author: Jeremy
   ========================================================================== */
/* ==========================================================================
Page colour
   ========================================================================== */

/* Page background colour */
body {
 background-color: #F1F4F7;
 }
/* ==========================================================================
site policy
   ========================================================================== */

.policybox {
height: 20em;
}


/* bring logo size into theme appropriate level */
.totaraNav_prim .masthead_logo--header_img {
    height:5rem;
}
/*make the text in links match drinkaware..co.uk size and padding styling*/
.totaraNav_prim--list_item_label {
    margin-bottom: -56px;
    font-size: 2rem;
    font-weight: bold;
}
/*make hover underline align with other underlines*/
.totaraNav_prim--list_item_link {
    height: 0px;
}
/*adjust caret*/
span.flex-icon.ft-fw.ft.tfont-var-chevron-down.totaraNav--icon_chevron {
    top: 12px;
}
/*sit secondary nav at bottom of navbar*/
.navExpand--listSecond {
    margin-top: 50px;
}
/*login page changes begin*/
body#page-login-index {
  --drinkaware-purple: #5b2c83;
  --drinkaware-navy: #0b3558;
  --bg-tint: #eef2fb;
  background: var(--bg-tint);
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
}

/* === Full-page background image via Ventura upload === */
/* Full-viewport login hero background */
body.path-login #login_hero-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  max-height: max-content;
  z-index: -1;              /* behind login form */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Main content floats above */
body.path-login #region-main {
  position: relative;
  z-index: 1;
  max-width: 560px;
  margin: 4rem auto;
  padding: 2rem;
}

/* Main content wrapper */
#page-login-index #region-main,
#page-login-index .loginform,
#page-login-index .page-content {
  position: relative;
  z-index: 1;
}
#page-login-index #region-main {
  max-width: 720px;
  padding: 4rem 2rem;
  margin-left: clamp(1rem, 6vw, 6rem);
}

/* Headline treatment */
#page-login-index h1,
#page-login-index .page-title,
#page-login-index .login-heading {
  color: var(--drinkaware-navy);
  font-weight: 800;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.1;
  margin: 0 0 1.5rem 0;
}

/* Panels */
#page-login-index .loginpanel,
#page-login-index .signuppanel {
  display: block;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
  padding: 1.25rem;
}
#page-login-index .signuppanel {
  border-left: 6px solid var(--drinkaware-purple);
  padding: 1rem 1.25rem;
}

/* Parent flex for ordering */
#page-login-index .loginpanelparent,
#page-login-index .page-content .box,
#page-login-index .loginbox,
#page-login-index #region-main > .card,
#page-login-index #region-main > .box,
#page-login-index #region-main > div {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
#page-login-index .loginpanel { order: 1; }
#page-login-index .signuppanel { order: 2; }

/* Unified panel headings */
#page-login-index .loginpanel h2,
#page-login-index .loginpanel .card-title,
#page-login-index .loginpanel legend,
#page-login-index .signuppanel h2,
#page-login-index .signuppanel .title {
  font-size: 2.55rem;
  font-weight: 400;
  margin-bottom: 0.75rem;
  color: #003d62;
}

/* Login form controls */
#page-login-index .loginpanel input[type="text"],
#page-login-index .loginpanel input[type="email"],
#page-login-index .loginpanel input[type="password"] {
  width: 100%;
  height: 44px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  padding: 0 12px;
  font-size: 16px;
  background: #fff;
}
#page-login-index .loginpanel input::placeholder { color: #98a2b3; }

/* Labels – updated to body size */
#page-login-index .loginpanel label {
  font-size: var(--font-body-size, 1.4rem);
  color: #003d62;
}

/* Primary action button */
#page-login-index .loginpanel button[type="submit"],
#page-login-index .loginpanel input[type="submit"] {
  background: var(--drinkaware-purple);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 0.75rem 1.25rem;
  font-weight: 400;
  font-size: 1.5rem;
  cursor: pointer;
  transition: transform .02s ease, background-color .2s ease;
}
#page-login-index .loginpanel button[type="submit"]:hover,
#page-login-index .loginpanel input[type="submit"]:hover {
  background: #4a216e;
}
#page-login-index .loginpanel button[type="submit"]:active,
#page-login-index .loginpanel input[type="submit"]:active {
  transform: translateY(1px);
}

/* Links */
#page-login-index .loginpanel a,
#page-login-index .signuppanel a {
  color: var(--drinkaware-purple);
  text-underline-offset: 2px;
}

/* Sign-up panel inner content */
#page-login-index .signuppanel h3,
#page-login-index .signuppanel .title {
  font-weight: 700;
}
#page-login-index .signuppanel p {
  margin: 0 0 .75rem 0;
  color: #475569;
  font-size: 1rem;
}
#page-login-index .signuppanel .btn,
#page-login-index .signuppanel a.button,
#page-login-index .signuppanel .cta {
  display: inline-block;
  background: var(--drinkaware-purple);
  color: #fff;
  border-radius: 999px;
  padding: 0.6rem 1rem;
  font-weight: 700;
  text-decoration: none;
}

/*registration page*/
.mform legend a {
    color: #003d62;
}
/*hide country from list of requested fields*/
div#fitem_id_country {
    display: none;
}

/* Responsive tweaks */
@media (min-width: 1024px) {
  #page-login-index #region-main {
    max-width: 560px;
    padding-top: 5rem;
  }
}
@media (max-width: 1019px) {
  #page-login-index #region-main {
    max-width: 680px;
    margin: 0 auto;
    padding-top: calc(34vh + 1rem);
  }
}

/* ==========================================================================
   Featured Links – Hover-animated text reveal
   ========================================================================== */
.block-totara-featured-links-tile {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 300px;
  transition: transform 0.3s ease;
}
.block-totara-featured-links-content-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  transform: translateY(100%);
  background: transparent;
  padding: 0;
  transition: transform 0.4s ease;
  z-index: 2;
}
.block-totara-featured-links-tile:hover .block-totara-featured-links-content-container {
  transform: translateY(0);
}
.block-totara-featured-links-tile .block-totara-featured-links-content-container .block-totara-featured-links-content.block-totara-featured-links-content {
  padding: 2rem!important;
  text-align: left;
  color: #333;
}
.block-totara-featured-links-content h3 {
  margin-top: 0;
  font-size: 1.2rem;
  font-weight: 600;
  color: #1f1f1f;
}
.block-totara-featured-links-content p {
  margin: 0.5rem 0 0;
  font-size: 0.9rem;
  color: #666;
}
.block-totara-featured-links-content h3,
.block-totara-featured-links-content p {
  opacity: 0;
  transition: opacity 0.3s ease 0.2s;
}
.block-totara-featured-links-tile:hover .block-totara-featured-links-content h3,
.block-totara-featured-links-tile:hover .block-totara-featured-links-content p {
  opacity: 1;
}

/* Sign-up panel change colour of new account button */
.signupform input {
    background-color: #5B2C83;
    color: white;
    border-radius: 18px;
 
}

/*** Login page - Create new account button ***/
#page-login-index {
	input[value="Create new account"] {
		border: none;
	&:hover {
		background: #4a216e;
		color: white;
		box-shadow: none;
	}
	}
}
/*** END Login page - Create new account button ***/
/**** Login page layout ****/
#page-login-index {
	& .loginbox {
		flex-direction: row;
	    gap: 0.75rem;
	    justify-content: left;
	    align-items: flex-start;
	}
}
@media screen and (max-width: 600px) {
    #page-login-index .loginbox {
        flex-wrap: wrap;
    }
    #page-login-index #region-main {
    	padding-top: 40px;
    }
}
/**** END Login page layout ****/
/*** Self reg ***/
#page-login-signup  #region-main {
	display: block;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(16, 24, 40, 0.08);
    border-left: 6px solid #5B2C83;
    padding: 1rem 1.25rem;
}
#page-login-signup  #region-main {
	max-width: 1000px;
}
/*** END Self reg ***/
/*** Breadcrumbs ***/
/* Add dashboard or course or module ID here - comma separated - prefix dashboard with # and course or mod id with . */
#page-totara-dashboard-1, .course-29, .course-30, .cmid-80, .cmid-81 {
	& .breadcrumb-nav .breadcrumb {
		display: none;
	}
}
/*** END Breadcrumbs ***/

/**** 12-12-25 PH ****/
.totaraNav nav {
	padding: 12px 0;
}
.totaraNav_prim--side .language-selector {
	display: none;
}
#page-login-index {
	& .loginbox {
		align-items: unset !important;
	}
	& input[type="submit"], .potentialidp .btn {
		min-width: 200px;
	}
	& .signuppanel {
		border-left: none;
	}
}
#page-admin-tool-sitepolicy-userpolicy {
	& #page {
		max-width: 1200px;
    	margin: auto;
	}
	& .policybox {
		border: none;
		overflow: auto;
	}
	input[type="submit"] {
		background: #5b2c83;
	    color: #fff;
	    border: none;
	    border-radius: 999px;
	    padding: 0.75rem 1.25rem;
	    font-weight: 400;
	    font-size: 1.5rem;
	    cursor: pointer;
	    transition: transform .02s ease, background-color .2s ease;
	    min-width: 200px;
	    &:hover {
	    	background: #4a216e;
	    }
	}
}
#page-login-signup {
	& #region-main {
		border-left: none;
		& #fitem_id_city {
			display: none;
		}
	}
}
/*** Block Appearance - Block Width fix  ***/

.block-region {
    display: grid;
    float: revert;
    grid-template-columns: repeat(12, 1fr);
    gap: 10px;
    margin-bottom: 10px;
}

.block {
    grid-column: auto / span 12;
    margin-bottom: 0
}

@media (min-width: 990px) {
    .block.block-width-3 {
        grid-column:auto / span 3
    }

    .block.block-width-4 {
        grid-column: auto / span 4
    }

    .block.block-width-6 {
        grid-column: auto / span 6;
    }

    .block.block-width-8 {
        grid-column: auto / span 8
    }

    .block.block-width-9 {
        grid-column: auto / span 9
    }

    .block.block-width-12 {
        grid-column: auto / span 12
    }
}

.skip-block-to {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.skip-block-to:active, .skip-block-to:focus {
    position: static;
    display: block;
    width: auto;
    height: auto;
}

/*** END Block Appearance - Block Width fix ***/


/*** SCORM - Exit button styling and position ***/
#page-mod-scorm-player [title="Save and exit activity"] {
	/* style */
	display: inline-block;
    flex-shrink: 0;
    max-width: 100%;
    min-height: var(--btn-min-height);
    padding: calc((var(--btn-min-height) - var(--btn-font-size) * var(--btn-line-height)) / 2 - var(--btn-border-width)) var(--btn-padding-h);
    color: white;
    font-size: var(--btn-font-size);
    line-height: var(--btn-line-height);
    overflow-wrap: break-word;
    background: var(--btn-text-color);
    border: var(--btn-border-width) solid;
    border-color: var(--btn-text-color);
    border-radius: var(--btn-radius);
    cursor: pointer;
    -webkit-transition: background-color var(--transition-button-duration) var(--transition-button-function), border-color var(--transition-button-duration) var(--transition-button-function), box-shadow var(--transition-button-duration) var(--transition-button-function);
    transition: background-color var(--transition-button-duration) var(--transition-button-function), border-color var(--transition-button-duration) var(--transition-button-function), box-shadow var(--transition-button-duration) var(--transition-button-function);
    vertical-align: middle;
    touch-action: manipulation;
    margin-bottom: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    &:hover {
    	color: white;
    	scale: 1.02
    }
    /* Position */
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 10;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
/*** END SCORM - Exit button styling and position ***/
/* Upcoming Events */
.block_calendar_upcoming {
	& .block-content {
		font-size: 16px;
		& .event {
			& a[href*="/mod/facetoface/view.php?"] {
				font-size: 18px;
				font-weight: bold;
			}
		}
		& .pull-right .btn {
				display: inline-block;
			    flex-shrink: 0;
			    max-width: 100%;
			    min-height: var(--btn-min-height);
			    padding: calc((var(--btn-min-height) - var(--btn-font-size) * var(--btn-line-height)) / 2 - var(--btn-border-width)) var(--btn-padding-h);
			    color: white;
			    font-size: var(--btn-font-size);
			    line-height: var(--btn-line-height);
			    overflow-wrap: break-word;
			    background: var(--btn-text-color);
			    border: var(--btn-border-width) solid;
			    border-color: var(--btn-text-color);
			    border-radius: var(--btn-radius);
			    cursor: pointer;
			    -webkit-transition: background-color var(--transition-button-duration) var(--transition-button-function), border-color var(--transition-button-duration) var(--transition-button-function), box-shadow var(--transition-button-duration) var(--transition-button-function);
			    transition: background-color var(--transition-button-duration) var(--transition-button-function), border-color var(--transition-button-duration) var(--transition-button-function), box-shadow var(--transition-button-duration) var(--transition-button-function);
			    vertical-align: middle;
			    touch-action: manipulation;
			    margin-bottom: 0;
			    -webkit-user-select: none;
			    -moz-user-select: none;
			    -ms-user-select: none;
			    user-select: none;
			    &:hover {
			    	color: white;
			    	scale: 1.02
			    }
		}
	}
}
/* END - Upcoming Events */
/*** Login Page Overflow Fix ***/
#page-login-index {
	background: white !important;
	& #page {
		background-color: white;
	}
	& #region-main {
		padding: 10px;
		margin: 0px 60px;
	}
	& #page-footer {
		margin: 0;
		& .page-footer-main-content {
			gap: 0;
			padding-top: 0;
		}
	}
}
/*** END Login Page Overflow Fix ***/

/*** Screen Optimisation ***/
@media screen and (max-width: 991px) {
	/* Mobile Menu */
	.totaraNav_prim--list_showMobile {
		& .totaraNav_prim--list_item_link {
			height: auto;
			margin-bottom: 10px;
		}
	}
}
/*** END Screen Optimisation ***/

/*test removal of breadcrumb from course id=28*/
.course-28 .breadcrumb-nav {
    display: none;
}
/*end test remove breadcrumb course 28*/
/*** Webinar page ***/
#inst476.block_html .vjs-poster{
	background-size: 120%;
}
/*** My Learning Page ***/
/* Enrolled Learning */
#inst351 {
	margin-bottom: 40px;
	margin-top: 20px;
	& h2 {
		font-size: 30px;
	}
}
/*** My Team page ***/
#inst363, #inst488 {
	h2 {
		font-size: 30px;
	}
}
/*** Page Banner ***/
#DA-page-banner {
	& .block-totara-featured-links-content-container {
  transform: translateY(0);
	}
	& .block-totara-featured-links-content h3 {
		opacity: 1;
	}
	& .block-totara-featured-links-content::before {
		background: unset;
	}
	& .block-totara-featured-links-content h1 {
		color: #0C3E62;
		font-weight: bold;
	    font-size: 48px;
	    text-align: center;
	}
	& .block-totara-featured-links-content h4 {
		color: #0C3E62;
		font-size: 24px;
		font-weight: 400;
		/* background: #e6e1f099; */
		padding: 6px;
		text-align: center;
		padding: 10px;
	}
	& .block-totara-featured-links-content {
		max-width: fit-content;
	    border-radius: 24px;
	}
	& .block-totara-featured-links-content-container {
		display: flex;
    	justify-content: center;
	}
}
#DA-page-banner-white-text {
	& .block-totara-featured-links-content-container {
  transform: translateY(0);
	}
	& .block-totara-featured-links-content h3 {
		opacity: 1;
	}
	& .block-totara-featured-links-content::before {
		background: unset;
	}
	& .block-totara-featured-links-content h1 {
		color: white;
		font-weight: bold;
	    font-size: 48px;
	    text-align: center;
	}
	& .block-totara-featured-links-content h4 {
		color: white;
		font-size: 24px;
		font-weight: 400;
		padding: 6px;
		text-align: center;
		padding: 10px;
	}
	& .block-totara-featured-links-content {
		max-width: fit-content;
	    border-radius: 24px;
	}
	& .block-totara-featured-links-content-container {
		display: flex;
    	justify-content: center;
	}
}

/*** Think Grid Course Layout ***/
/* Add Course IDs here */
 .course-28, .course-29, .course-30 {
	& .think-grid-card {
		& .button-wrapper .btn {
			background: white;
			color: var(--btn-prim-bg-color);
			border-color: white;
			&:hover {
				transform: scale(1.05);
			}
		}
	}
}
/*** END Think Grid Course Layout ***/