/* --- CLEANED LAYOUT BASE --- */
.side-left {
  width: 250px;
  border: 1px solid #ff6600;
  padding: 20px;
  font-size: 12px;  
}

.side-right {
  width: 250px;
  border: 1px solid #ff6600;
  padding: 20px;
  font-size: 12px;  
}

.header {
    background: linear-gradient(180deg, rgba(250, 215, 95, 1) 0%, rgba(247, 107, 28, 1) 100%);
}

.card-header {
    padding: var(--card-cap-padding-y) var(--card-cap-padding-x);
    color: var(--card-cap-color);
    background-color: var(--card-cap-bg);
    border-bottom: var(--card-border-width) solid var(--card-border-color);
    margin-bottom: 0;
    font-size: 14px;
}

.footer {
    background: linear-gradient(180deg, rgba(250, 215, 95, 1) 0%, rgba(247, 107, 28, 1) 100%);
    color: #000;
}

.bg-info {
    --bg-opacity: 1;
    background-color: rgb(225 128 58) !important;
    float: right;
}

a:not([class]) {
    text-decoration: none;   
}

/* --- COLOUR SCHEME --- */
:root {
  --color-brand-primary: #ff6600;
  --color-link-hover: #ff8533;
  --color-link-active: #cc5200;
  --color-link-visited: #ff6600;
  --color-dark-bg: #1a1a1a;
  --color-light-bg: #f9f9f9;
  --color-light-hover-bg: #ffebe0;
  --color-border-subtle: #e0e0e0;
  --color-border-brand: #ff9955;
  --color-accent-blue: #a51f18;
  /*  #FF9D5C  */
}


a {
  color: var(--color-brand-primary);
  text-decoration: none;
  transition: color 0.2s ease, background-color 0.2s ease;
}

a:visited {
  color: var(--color-link-visited);
}

a:hover, 
a:focus-visible {
  color: var(--color-link-hover);
  text-decoration: underline;
}

a:active {
  color: var(--color-link-active);
}

.menu-dark {
  background-color: var(--color-dark-bg);
  border-bottom: 2px solid var(--color-brand-primary);
  padding: 1rem;
}

.menu-dark a {
  color: #ffffff;
  text-decoration: none;
}

.menu-dark a:hover {
  color: var(--color-brand-primary);
}

.menu-light {
  background-color: var(--color-light-bg);
  border-bottom: 1px solid var(--color-border-subtle);
  padding: 1rem;
}

.menu-light a {
  color: #000000;
  text-decoration: none;
  padding: 0.5rem 1rem;
  border-radius: 4px;
}

.menu-light a:hover {
  color: var(--color-brand-primary);
  background-color: var(--color-light-hover-bg);
}

.card-component {
  border: 1px solid var(--color-border-subtle);
}

.card-component:focus-within {
  border-color: var(--color-border-brand);
}

.btn-cta {
  background-color: var(--color-accent-blue);
  color: #ffffff;
}

h3, .h3 {
    font-size: 1.0rem;
}

#jem .copyright {
    font-size: 0.9em;
    clear: both;
    float: none;
    width: 100%;
    margin: 1em 0;
    text-align: center;
    color: #808080;
    display: none !important;
}

.btn-info {
    --btn-color: #fff;
    --btn-bg: #6600ff;
    --btn-border-color: #30638d;
    --btn-hover-color: #fff;
    --btn-hover-bg: #e600ff;
    --btn-hover-border-color: #264f70;
    --btn-focus-shadow-rgb: 79, 122, 158;
    --btn-active-color: #fff;
    --btn-active-bg: #264f70;
    --btn-active-border-color: #244a69;
    --btn-active-shadow: inset 0 3px 5px #00000020;
    --btn-disabled-color: #fff;
    --btn-disabled-bg: #30638d;
    --btn-disabled-border-color: #30638d;
    border-radius: 10px;
}

/* --- HEADER FLEX: Logo (1) / Menu (2) / Search (3) --- */

/* Make the real header container flex */
.container-topbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    width: 100% !important;
}

/* Order the three modules */
.container-topbar > ul.mod-menu_dropdown-metismenu {
    order: 2 !important;   /* Main Menu */
    flex-grow: 1 !important;
}

.container-topbar > #mod-custom173 {
    order: 1 !important;   /* Logo */
}

.container-topbar > #mod-menu174 {
    order: 3 !important;   /* Search */
}

/* --- Move MetisMenu arrows to the right --- */

/* Make the toggler button a flex container */
.container-topbar .mm-toggler,
.container-topbar .mm-toggler-link,
.container-topbar .mm-toggler-nolink {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;     /* ensures arrow goes to the far right */
    padding-right: 10px !important;
}

/* Move the arrow icon to the right */
.container-topbar .mm-toggler::after,
.container-topbar .mm-toggler-link::after,
.container-topbar .mm-toggler-nolink::after {
    margin-left: auto !important;
    right: 0 !important;
    position: relative !important;
}

/* Add spacing between text and arrow WITHOUT enlarging the arrow */
.container-topbar .mm-toggler,
.container-topbar .mm-toggler-link,
.container-topbar .mm-toggler-nolink {
    padding-right: 10px !important;   /* space between text and arrow */
}

/* Shrink MetisMenu arrow size */
.container-topbar .mm-toggler::after,
.container-topbar .mm-toggler-link::after,
.container-topbar .mm-toggler-nolink::after {
    width: 10px !important;        /* arrow width */
    height: 10px !important;       /* arrow height */
    background-size: 10px 10px !important;  /* scale the SVG */
    margin-left: auto !important;  /* keep arrow on the right */
}

/* TOP-LEVEL MENU: add spacing between text and arrow */
.container-topbar .mod-menu__heading.nav-header::after {
    margin-left: 12px !important;      /* space between text and arrow */
    width: 10px !important;            /* arrow width */
    height: 10px !important;           /* arrow height */
    background-size: 10px 10px !important; /* keep arrow small */
    position: relative !important;
}
/* Extra spacing for long top-level menu items 
.container-topbar ul.mod-menu_dropdown-metismenu > li.metismenu-item > .mod-menu__heading.nav-header {
    padding-right: 26px !important;   /* more space before arrow */
}

/* Add spacing between text and arrow for TOP-LEVEL menu items */
.container-topbar .mod-menu__heading.nav-header {
    padding-right: 20px !important;   /* clean spacing before arrow */
}
  
.metismenu-item > a {
    margin-right: 10px !important;
}

.metismenu.mod-menu .mm-collapse>li.parent>ul {
    box-shadow: none;
    background-color: #F8B8FF;
    flex-basis: calc(100% + 1em);
    margin-top: .5em;
    margin-bottom: -.5em;
    position: relative;
    top: 0;
    border: 1px solid;
}

.metismenu.mod-menu .mm-collapse>li>a {
    display: inline-flex;
}

.metismenu.mod-menu
.metismenu-item.active>a,
.metismenu.mod-menu .metismenu-item.active>button,
.metismenu.mod-menu .metismenu-item>a:hover,
.metismenu.mod-menu .metismenu-item>button:hover {
text-decoration: none;
color: #6600ff; }



/* Venue Display */
div#jem.jem_venue .jem-venue-overview-panel {
    align-items: center;
    background: rgba(248, 250, 252, .82);
    border: 1px solid rgba(148, 163, 184, .35);
    border-radius: 6px;
    box-sizing: border-box;
    display: grid;
    gap: 1.5rem;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, max-content);
    margin: 0 0 1.35rem;
    padding: 1rem 1.1rem;
    display: none !important;
}

div#jem.jem_venue h2 {
    color: #ffffff;
    display: none !important;
}