{"id":216,"date":"2026-05-25T11:08:44","date_gmt":"2026-05-25T11:08:44","guid":{"rendered":"https:\/\/marketplace.dbaasltd.com\/?page_id=216"},"modified":"2026-05-26T09:52:13","modified_gmt":"2026-05-26T09:52:13","slug":"accounts","status":"publish","type":"page","link":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/","title":{"rendered":"Accounts"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"216\" class=\"elementor elementor-216\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-afdd534 elementor-section-full_width elementor-section-stretched elementor-section-height-default elementor-section-height-default\" data-id=\"afdd534\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;stretch_section&quot;:&quot;section-stretched&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-14fae60\" data-id=\"14fae60\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-620728c elementor-widget elementor-widget-shortcode\" data-id=\"620728c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>My Account \u2014 BritHaven Tech<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Syne:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap\" rel=\"stylesheet\">\n<style>\n*{box-sizing:border-box;margin:0;padding:0}\n:root{\n  --ink:#0A0F1E;--navy:#0C1A4B;--navy2:#112266;--blue:#1547E8;--blue2:#0F39C8;\n  --blue-lt:#EBF0FF;--sky:#E8F0FE;--white:#FFFFFF;--g50:#F7F8FC;--g100:#EDEEF4;\n  --g200:#D8DAE8;--g400:#9BA3BF;--g600:#5C6480;--g700:#3A405A;\n  --green:#0B7A45;--green-lt:#E6F5EE;--red:#C0272D;--red-lt:#FEF0F0;\n  --amber:#B45309;--amber-lt:#FFF8ED;--purple:#5B21B6;--purple-lt:#F3F0FF;\n  --teal:#0F766E;--teal-lt:#EDFAF8;\n  --shadow-xs:0 1px 2px rgba(10,15,30,0.06);--shadow-sm:0 2px 8px rgba(10,15,30,0.08);\n  --shadow-md:0 6px 20px rgba(10,15,30,0.1);--shadow-lg:0 16px 48px rgba(10,15,30,0.14);\n  --r4:4px;--r6:6px;--r8:8px;--r10:10px;--r12:12px;--r16:16px;\n}\nbody{font-family:'DM Sans',sans-serif;background:var(--g50);color:var(--ink);line-height:1.5;font-size:14px;min-height:100vh}\n\n\/* \u2500\u2500 TOPBAR \u2500\u2500 *\/\n.topbar{background:var(--navy);padding:7px 24px;display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:rgba(255,255,255,0.65)}\n.tb-r{display:flex;gap:18px;align-items:center}\n.tb-r span{cursor:pointer;transition:color 0.15s}\n.tb-r span:hover{color:#fff}\n.tb-badge{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.15);border-radius:20px;padding:2px 10px;font-size:10.5px;font-weight:600;letter-spacing:0.03em;color:rgba(255,255,255,0.9)}\n\n\/* \u2500\u2500 HEADER \u2500\u2500 *\/\n.header{background:#fff;border-bottom:1px solid var(--g100);position:sticky;top:0;z-index:500;box-shadow:var(--shadow-xs)}\n.header-inner{max-width:1440px;margin:0 auto;padding:0 24px;height:64px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center}\n.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;cursor:pointer}\n.logo-mark{width:36px;height:36px;background:var(--navy);border-radius:var(--r8);display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:800;font-size:12px;color:#fff;letter-spacing:-0.02em}\n.logo-text{font-family:'Syne',sans-serif;font-weight:700;font-size:17px;color:var(--navy);letter-spacing:-0.03em}\n.logo-text em{color:var(--blue);font-style:normal}\n.search-wrap{display:flex;background:var(--g50);border:1.5px solid var(--g200);border-radius:var(--r8);overflow:hidden;transition:border-color 0.2s,box-shadow 0.2s}\n.search-wrap:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,71,232,0.08);background:#fff}\n.search-input{flex:1;padding:10px 16px;border:none;background:transparent;font-family:'DM Sans',sans-serif;font-size:13px;color:var(--ink);outline:none}\n.search-input::placeholder{color:var(--g400)}\n.search-btn{padding:10px 20px;background:var(--blue);color:#fff;font-size:13px;font-weight:600;font-family:'DM Sans',sans-serif;border:none;cursor:pointer;transition:background 0.2s}\n.search-btn:hover{background:var(--blue2)}\n.header-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}\n.h-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:var(--r8);font-size:12.5px;font-weight:500;color:var(--g700);cursor:pointer;transition:all 0.15s;border:none;background:none;font-family:'DM Sans',sans-serif;white-space:nowrap}\n.h-btn:hover{background:var(--g50);color:var(--ink)}\n.h-btn.active-nav{background:var(--blue-lt);color:var(--blue);font-weight:600}\n.cart-chip{display:flex;align-items:center;gap:7px;padding:8px 14px;background:var(--blue);color:#fff;border-radius:var(--r8);font-size:12.5px;font-weight:600;cursor:pointer;transition:all 0.2s;font-family:'DM Sans',sans-serif;border:none}\n.cart-chip:hover{background:var(--blue2);transform:translateY(-1px)}\n.cart-count{background:rgba(255,255,255,0.25);border-radius:12px;padding:1px 7px;font-size:10px;font-weight:700}\n.h-contact{padding:8px 16px;background:var(--navy);color:#fff;border-radius:var(--r8);font-size:12.5px;font-weight:600;cursor:pointer;transition:background 0.2s;border:none;font-family:'DM Sans',sans-serif;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center}\n.h-contact:hover{background:var(--navy2)}\n\n\/* \u2500\u2500 NAV \u2500\u2500 *\/\n.nav{background:#fff;border-bottom:2px solid var(--navy);position:sticky;top:64px;z-index:400}\n.nav-inner{max-width:1440px;margin:0 auto;padding:0 24px;display:flex;align-items:center}\n.nav-lnk{padding:14px 16px;font-size:13px;font-weight:500;color:var(--g700);cursor:pointer;display:flex;align-items:center;gap:5px;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all 0.15s;white-space:nowrap;font-family:'DM Sans',sans-serif;text-decoration:none}\n.nav-lnk:hover,.nav-lnk.active{color:var(--blue);border-bottom-color:var(--blue)}\n.nav-deals{color:#B45309!important;font-weight:700!important}\n\n\/* \u2500\u2500 ACCOUNT HERO BANNER \u2500\u2500 *\/\n.acc-hero{background:var(--navy);position:relative;overflow:hidden}\n.acc-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 120% at 90% 50%,rgba(21,71,232,0.3) 0%,transparent 70%);pointer-events:none}\n.acc-hero-inner{max-width:1440px;margin:0 auto;padding:32px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:1}\n.acc-hero-left{display:flex;align-items:center;gap:20px}\n.acc-avatar{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--blue) 0%,#3B82F6 100%);border:3px solid rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:800;font-size:22px;color:#fff;flex-shrink:0}\n.acc-hero-name{font-family:'Syne',sans-serif;font-size:22px;font-weight:800;color:#fff;letter-spacing:-0.02em;margin-bottom:4px}\n.acc-hero-meta{font-size:12.5px;color:rgba(255,255,255,0.55);display:flex;align-items:center;gap:14px;flex-wrap:wrap}\n.acc-hero-meta span{display:flex;align-items:center;gap:5px}\n.acc-hero-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.15);border-radius:20px;font-size:10.5px;font-weight:700;color:rgba(255,255,255,0.85);letter-spacing:0.04em}\n.acc-hero-right{display:flex;gap:8px;flex-shrink:0;flex-wrap:wrap}\n.acc-hero-btn{padding:10px 18px;border-radius:var(--r8);font-size:12.5px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all 0.2s;border:none;white-space:nowrap}\n.acc-hero-btn.primary{background:var(--blue);color:#fff}\n.acc-hero-btn.primary:hover{background:var(--blue2);transform:translateY(-1px)}\n.acc-hero-btn.ghost{background:rgba(255,255,255,0.08);color:#fff;border:1.5px solid rgba(255,255,255,0.2)}\n.acc-hero-btn.ghost:hover{background:rgba(255,255,255,0.15)}\n\n\/* \u2500\u2500 ACCOUNT LAYOUT \u2500\u2500 *\/\n.acc-layout{max-width:1440px;margin:0 auto;padding:32px 24px;display:grid;grid-template-columns:240px 1fr;gap:24px;align-items:start}\n\n\/* \u2500\u2500 SIDEBAR NAV \u2500\u2500 *\/\n.acc-sidebar{display:flex;flex-direction:column;gap:6px;position:sticky;top:140px}\n.acc-nav-group{margin-bottom:4px}\n.acc-nav-label{font-size:10px;font-weight:700;color:var(--g400);text-transform:uppercase;letter-spacing:0.1em;padding:6px 12px;margin-bottom:2px}\n.acc-nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r8);font-size:13px;font-weight:500;color:var(--g700);cursor:pointer;transition:all 0.15s;border:none;background:none;font-family:'DM Sans',sans-serif;width:100%;text-align:left}\n.acc-nav-item:hover{background:#fff;color:var(--ink);box-shadow:var(--shadow-xs)}\n.acc-nav-item.active{background:#fff;color:var(--blue);font-weight:600;box-shadow:var(--shadow-sm)}\n.acc-nav-item .nav-icon{font-size:15px;flex-shrink:0;width:20px;text-align:center}\n.acc-nav-item .nav-badge{margin-left:auto;background:var(--blue-lt);color:var(--blue);font-size:10px;font-weight:700;padding:1px 7px;border-radius:10px}\n.acc-nav-item.active .nav-badge{background:var(--blue);color:#fff}\n.acc-nav-divider{height:1px;background:var(--g100);margin:8px 0}\n\n\/* \u2500\u2500 MAIN CONTENT \u2500\u2500 *\/\n.acc-main{display:flex;flex-direction:column;gap:20px}\n\n\/* \u2500\u2500 CARDS \u2500\u2500 *\/\n.card{background:#fff;border:1.5px solid var(--g100);border-radius:var(--r12);overflow:hidden;box-shadow:var(--shadow-xs)}\n.card-head{padding:18px 24px;border-bottom:1px solid var(--g100);display:flex;align-items:center;justify-content:space-between;gap:12px}\n.card-title{font-family:'Syne',sans-serif;font-size:15px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px}\n.card-title .ct-icon{font-size:16px}\n.card-action{font-size:12.5px;font-weight:600;color:var(--blue);cursor:pointer;transition:color 0.15s;background:none;border:none;font-family:'DM Sans',sans-serif;padding:0}\n.card-action:hover{color:var(--blue2)}\n.card-body{padding:24px}\n\n\/* \u2500\u2500 SUMMARY STATS \u2500\u2500 *\/\n.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--g100)}\n.stat-box{background:#fff;padding:20px 24px;text-align:center}\n.stat-box:first-child{border-radius:var(--r12) 0 0 0}\n.stat-box:last-child{border-radius:0 var(--r12) 0 0}\n.stat-num{font-family:'Syne',sans-serif;font-size:26px;font-weight:800;color:var(--navy);letter-spacing:-0.04em;margin-bottom:4px}\n.stat-num.blue{color:var(--blue)}\n.stat-num.green{color:var(--green)}\n.stat-num.amber{color:var(--amber)}\n.stat-lbl{font-size:11px;color:var(--g400);font-weight:500}\n.stat-delta{font-size:10.5px;color:var(--green);font-weight:600;margin-top:2px;display:flex;align-items:center;justify-content:center;gap:3px}\n.stat-delta.neg{color:var(--amber)}\n\n\/* \u2500\u2500 ACTIVE LICENCES \u2500\u2500 *\/\n.licence-table{width:100%;border-collapse:collapse}\n.lt-head th{padding:10px 14px;text-align:left;font-size:10.5px;font-weight:700;color:var(--g400);text-transform:uppercase;letter-spacing:0.07em;border-bottom:2px solid var(--g100);white-space:nowrap}\n.lt-row{border-bottom:1px solid var(--g100);transition:background 0.15s}\n.lt-row:last-child{border-bottom:none}\n.lt-row:hover{background:var(--g50)}\n.lt-row td{padding:13px 14px;font-size:13px;vertical-align:middle}\n.lt-product{display:flex;align-items:center;gap:10px}\n.lt-prod-icon{width:32px;height:32px;border-radius:var(--r8);background:var(--g50);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;border:1px solid var(--g100)}\n.lt-prod-name{font-weight:600;color:var(--ink);font-size:12.5px;margin-bottom:2px}\n.lt-prod-vendor{font-size:10.5px;color:var(--g400)}\n.status-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:10.5px;font-weight:700}\n.status-pill.active{background:var(--green-lt);color:var(--green)}\n.status-pill.expiring{background:var(--amber-lt);color:var(--amber)}\n.status-pill.expired{background:var(--red-lt);color:var(--red)}\n.status-pill.pending{background:var(--purple-lt);color:var(--purple)}\n.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}\n.lt-renew-btn{padding:6px 14px;background:var(--blue);color:#fff;border:none;border-radius:var(--r6);font-size:11.5px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all 0.2s;white-space:nowrap}\n.lt-renew-btn:hover{background:var(--blue2)}\n.lt-renew-btn.outline{background:#fff;color:var(--ink);border:1.5px solid var(--g200)}\n.lt-renew-btn.outline:hover{border-color:var(--blue);color:var(--blue)}\n.progress-bar-wrap{width:100px;height:4px;background:var(--g100);border-radius:2px;overflow:hidden}\n.progress-bar{height:100%;border-radius:2px;background:var(--green);transition:width 0.3s}\n.progress-bar.warn{background:var(--amber)}\n.progress-bar.danger{background:var(--red)}\n\n\/* \u2500\u2500 ORDERS \u2500\u2500 *\/\n.order-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--g100)}\n.order-row:last-child{border-bottom:none}\n.order-icon{width:40px;height:40px;background:var(--g50);border-radius:var(--r10);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border:1px solid var(--g100)}\n.order-info{flex:1;min-width:0}\n.order-ref{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:2px}\n.order-detail{font-size:11.5px;color:var(--g600)}\n.order-amount{text-align:right;flex-shrink:0}\n.order-price{font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:2px}\n.order-date{font-size:10.5px;color:var(--g400)}\n\n\/* \u2500\u2500 QUOTES \u2500\u2500 *\/\n.quote-row{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--g100)}\n.quote-row:last-child{border-bottom:none}\n.quote-info{flex:1;min-width:0}\n.quote-ref{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:3px}\n.quote-products{font-size:11.5px;color:var(--g600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.quote-actions{display:flex;gap:8px;flex-shrink:0}\n\n\/* \u2500\u2500 PROFILE FORM \u2500\u2500 *\/\n.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}\n.form-group{display:flex;flex-direction:column;gap:6px}\n.form-group.full{grid-column:1\/-1}\n.form-label{font-size:12px;font-weight:600;color:var(--ink)}\n.form-input,.form-select{padding:10px 14px;border:1.5px solid var(--g200);border-radius:var(--r8);font-size:13px;font-family:'DM Sans',sans-serif;color:var(--ink);outline:none;transition:border-color 0.2s,box-shadow 0.2s;background:#fff;width:100%}\n.form-input:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,71,232,0.07)}\n.form-input[readonly]{background:var(--g50);color:var(--g600);cursor:default}\n.form-hint{font-size:11px;color:var(--g400);margin-top:-2px}\n.form-select{-webkit-appearance:none;appearance:none;background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239BA3BF' stroke-width='1.5' fill='none' stroke-linecap='round'\/%3E%3C\/svg%3E\");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer}\n\n\/* \u2500\u2500 SECURITY \u2500\u2500 *\/\n.sec-item{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--g100)}\n.sec-item:last-child{border-bottom:none}\n.sec-item-icon{width:40px;height:40px;border-radius:var(--r10);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}\n.sec-item-icon.green-bg{background:var(--green-lt)}\n.sec-item-icon.amber-bg{background:var(--amber-lt)}\n.sec-item-icon.blue-bg{background:var(--blue-lt)}\n.sec-item-info{flex:1;min-width:0}\n.sec-item-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:2px}\n.sec-item-desc{font-size:11.5px;color:var(--g600);line-height:1.5}\n.toggle-switch{position:relative;width:40px;height:22px;flex-shrink:0;cursor:pointer}\n.toggle-switch input{opacity:0;width:0;height:0;position:absolute}\n.toggle-track{position:absolute;inset:0;background:var(--g200);border-radius:11px;transition:background 0.2s}\n.toggle-thumb{position:absolute;top:3px;left:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:transform 0.2s;box-shadow:var(--shadow-xs)}\n.toggle-switch input:checked~.toggle-track{background:var(--green)}\n.toggle-switch input:checked~.toggle-track+.toggle-thumb,\n.toggle-switch input:checked+.toggle-track+.toggle-thumb{transform:translateX(18px)}\n\/* Simplified toggle approach *\/\n.tog{position:relative;display:inline-block;width:40px;height:22px;cursor:pointer}\n.tog input{opacity:0;width:0;height:0}\n.tog .track{position:absolute;inset:0;background:var(--g200);border-radius:11px;transition:0.2s}\n.tog input:checked+.track{background:var(--green)}\n.tog .track::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;background:#fff;border-radius:50%;transition:0.2s;box-shadow:0 1px 3px rgba(0,0,0,0.15)}\n.tog input:checked+.track::after{transform:translateX(18px)}\n\n\/* \u2500\u2500 NOTIFICATIONS \u2500\u2500 *\/\n.notif-item{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--g100)}\n.notif-item:last-child{border-bottom:none}\n.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--blue);flex-shrink:0;margin-top:5px}\n.notif-dot.read{background:var(--g200)}\n.notif-time{font-size:11px;color:var(--g400);white-space:nowrap;flex-shrink:0;margin-top:2px}\n.notif-body{flex:1;min-width:0}\n.notif-title{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:3px}\n.notif-desc{font-size:12px;color:var(--g600);line-height:1.55}\n\n\/* \u2500\u2500 RENEWAL ALERT \u2500\u2500 *\/\n.renewal-alert{background:linear-gradient(135deg,var(--amber-lt) 0%,#FFFBF0 100%);border:1.5px solid rgba(180,83,9,0.2);border-radius:var(--r10);padding:16px 20px;display:flex;align-items:flex-start;gap:14px}\n.ra-icon{font-size:20px;flex-shrink:0;margin-top:1px}\n.ra-body{flex:1}\n.ra-title{font-size:13.5px;font-weight:700;color:var(--amber);margin-bottom:4px}\n.ra-desc{font-size:12px;color:var(--g700);line-height:1.55;margin-bottom:10px}\n.ra-btn{padding:7px 16px;background:var(--amber);color:#fff;border:none;border-radius:var(--r6);font-size:12px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:background 0.2s}\n.ra-btn:hover{background:#92400E}\n\n\/* \u2500\u2500 QUICK ACTIONS \u2500\u2500 *\/\n.qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}\n.qa-item{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--g50);border:1.5px solid var(--g100);border-radius:var(--r10);cursor:pointer;transition:all 0.2s}\n.qa-item:hover{background:#fff;border-color:var(--blue);box-shadow:var(--shadow-sm);transform:translateY(-1px)}\n.qa-icon{font-size:20px;flex-shrink:0}\n.qa-label{font-size:12.5px;font-weight:600;color:var(--ink)}\n.qa-desc{font-size:11px;color:var(--g400);margin-top:1px}\n\n\/* \u2500\u2500 USAGE CHART BARS \u2500\u2500 *\/\n.usage-row{display:flex;align-items:center;gap:12px;margin-bottom:14px}\n.usage-row:last-child{margin-bottom:0}\n.usage-label{font-size:12px;font-weight:500;color:var(--g700);min-width:130px}\n.usage-bar-wrap{flex:1;height:8px;background:var(--g100);border-radius:4px;overflow:hidden}\n.usage-bar{height:100%;border-radius:4px;background:var(--blue);transition:width 0.6s ease}\n.usage-bar.green{background:var(--green)}\n.usage-bar.amber{background:var(--amber)}\n.usage-val{font-size:11.5px;font-weight:600;color:var(--g600);min-width:56px;text-align:right}\n\n\/* \u2500\u2500 SAVE BTN \u2500\u2500 *\/\n.save-btn{padding:10px 22px;background:var(--blue);color:#fff;border:none;border-radius:var(--r8);font-size:13px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all 0.2s}\n.save-btn:hover{background:var(--blue2);transform:translateY(-1px)}\n.cancel-btn{padding:10px 18px;background:#fff;color:var(--ink);border:1.5px solid var(--g200);border-radius:var(--r8);font-size:13px;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all 0.2s}\n.cancel-btn:hover{border-color:var(--g400)}\n\n\/* \u2500\u2500 FOOTER \u2500\u2500 *\/\n.footer{background:var(--ink);padding:48px 24px 24px;margin-top:40px}\n.footer-inner{max-width:1440px;margin:0 auto}\n.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:36px;margin-bottom:40px}\n.fg-brand{font-size:12px;color:rgba(255,255,255,0.45);line-height:1.75;margin-bottom:14px}\n.fc-ttl{font-family:'Syne',sans-serif;font-size:11px;font-weight:700;color:#fff;margin-bottom:14px;text-transform:uppercase;letter-spacing:0.07em}\n.fc-lnk{display:block;font-size:11.5px;color:rgba(255,255,255,0.45);margin-bottom:8px;cursor:pointer;transition:color 0.15s;text-decoration:none}\n.fc-lnk:hover{color:rgba(255,255,255,0.85)}\n.footer-bottom{border-top:1px solid rgba(255,255,255,0.07);padding-top:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}\n.fb-left{font-size:11px;color:rgba(255,255,255,0.3)}\n.fb-certs{display:flex;gap:6px;flex-wrap:wrap}\n.fb-cert{padding:3px 9px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:4px;font-size:9px;font-weight:700;color:rgba(255,255,255,0.4);letter-spacing:0.04em}\n.fb-links{display:flex;gap:14px;font-size:11px;color:rgba(255,255,255,0.3)}\n.fb-links a{cursor:pointer;transition:color 0.15s;text-decoration:none;color:rgba(255,255,255,0.3)}\n.fb-links a:hover{color:rgba(255,255,255,0.65)}\n\n\/* Toast *\/\n.toast{position:fixed;bottom:24px;right:24px;background:var(--ink);color:#fff;padding:12px 20px;border-radius:var(--r10);font-size:13px;font-weight:500;z-index:2000;transform:translateY(80px);opacity:0;transition:all 0.3s;pointer-events:none;box-shadow:var(--shadow-md)}\n.toast.show{transform:translateY(0);opacity:1}\n.toast.success{background:var(--green)}\n.toast.error{background:var(--red)}\n\n\/* Tabs within card *\/\n.card-tabs{display:flex;border-bottom:1px solid var(--g100);padding:0 24px;gap:0}\n.ctab{padding:12px 16px;font-size:13px;font-weight:500;color:var(--g600);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all 0.15s;white-space:nowrap;font-family:'DM Sans',sans-serif;background:none;border-top:none;border-left:none;border-right:none}\n.ctab:hover{color:var(--ink)}\n.ctab.active{color:var(--blue);border-bottom-color:var(--blue);font-weight:600}\n\n\/* Section label *\/\n.section-label{font-size:10.5px;font-weight:700;color:var(--g400);text-transform:uppercase;letter-spacing:0.08em;margin-bottom:14px;margin-top:4px}\n<\/style>\n<\/head>\n<body>\n\n\n\n\n\n\n\n<!-- ACCOUNT HERO -->\n<div class=\"acc-hero\">\n  <div class=\"acc-hero-inner\">\n    <div class=\"acc-hero-left\">\n      <div class=\"acc-avatar\">JW<\/div>\n      <div>\n        <div class=\"acc-hero-name\">James Wilson<\/div>\n        <div class=\"acc-hero-meta\">\n          <span>\ud83c\udfe2 Meridian Solutions Ltd<\/span>\n          <span>\u2709\ufe0f j.wilson@meridiansolutions.co.uk<\/span>\n          <span class=\"acc-hero-badge\">\u2b50 Premium Account<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n    <div class=\"acc-hero-right\">\n      <button class=\"acc-hero-btn ghost\" onclick=\"showToast('Opening support portal\u2026','')\">\ud83d\udcac Contact Support<\/button>\n      <button class=\"acc-hero-btn primary\" onclick=\"showSection('profile')\">\u270f\ufe0f Edit Profile<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- MAIN LAYOUT -->\n<div class=\"acc-layout\">\n\n  <!-- SIDEBAR -->\n  <aside class=\"acc-sidebar\">\n    <div class=\"acc-nav-label\">Account<\/div>\n    <button class=\"acc-nav-item active\" id=\"nav-overview\" onclick=\"showSection('overview')\">\n      <span class=\"nav-icon\">\ud83c\udfe0<\/span> Overview\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-licences\" onclick=\"showSection('licences')\">\n      <span class=\"nav-icon\">\ud83d\udd11<\/span> My Licences\n      <span class=\"nav-badge\">8<\/span>\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-orders\" onclick=\"showSection('orders')\">\n      <span class=\"nav-icon\">\ud83d\udce6<\/span> Orders &amp; Invoices\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-quotes\" onclick=\"showSection('quotes')\">\n      <span class=\"nav-icon\">\ud83d\udccb<\/span> Quote Requests\n      <span class=\"nav-badge\">2<\/span>\n    <\/button>\n    <div class=\"acc-nav-divider\"><\/div>\n    <div class=\"acc-nav-label\">Settings<\/div>\n    <button class=\"acc-nav-item\" id=\"nav-profile\" onclick=\"showSection('profile')\">\n      <span class=\"nav-icon\">\ud83d\udc64<\/span> Profile &amp; Company\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-security\" onclick=\"showSection('security')\">\n      <span class=\"nav-icon\">\ud83d\udee1\ufe0f<\/span> Security\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-notifications\" onclick=\"showSection('notifications')\">\n      <span class=\"nav-icon\">\ud83d\udd14<\/span> Notifications\n    <\/button>\n    <button class=\"acc-nav-item\" id=\"nav-billing\" onclick=\"showSection('billing')\">\n      <span class=\"nav-icon\">\ud83d\udcb3<\/span> Billing &amp; Payment\n    <\/button>\n    <div class=\"acc-nav-divider\"><\/div>\n    <button class=\"acc-nav-item\" onclick=\"showToast('Signed out successfully','success')\" style=\"color:var(--red)\">\n      <span class=\"nav-icon\">\ud83d\udeaa<\/span> Sign Out\n    <\/button>\n  <\/aside>\n\n  <!-- MAIN CONTENT -->\n  <main class=\"acc-main\">\n\n    <!-- \u2500\u2500 OVERVIEW \u2500\u2500 -->\n    <div id=\"section-overview\">\n\n      <!-- Renewal alert -->\n      <div class=\"renewal-alert\">\n        <div class=\"ra-icon\">\u26a0\ufe0f<\/div>\n        <div class=\"ra-body\">\n          <div class=\"ra-title\"> 2 Licences Expiring Within the Next 30 Days<\/div>\n          <div class=\"ra-desc\">Your Microsoft 365 Business Premium licence (50 seats) expires in\n<strong>18 days<\/strong> and SentinelOne Singularity Core expires in <strong>24 days<\/strong>. Renewing promptly ensures\nuninterrupted access for your team \u2014 our UK account team can process renewals\nthe same business day.<\/div>\n          <button class=\"ra-btn\" onclick=\"showSection('licences')\">View &amp; Renew Licences \u2192<\/button>\n        <\/div>\n      <\/div>\n\n      <!-- Stats -->\n      <div class=\"card\" style=\"overflow:hidden\">\n        <div class=\"stats-row\">\n          <div class=\"stat-box\">\n            <div class=\"stat-num\">8<\/div>\n            <div class=\"stat-lbl\">Active Licences<\/div>\n            <div class=\"stat-delta\">\u2191 2 added this year<\/div>\n          <\/div>\n          <div class=\"stat-box\">\n            <div class=\"stat-num blue\">347<\/div>\n            <div class=\"stat-lbl\">Total Licensed  Seats<\/div>\n            <div class=\"stat-delta\">\u2191 47 since January<\/div>\n          <\/div>\n          <div class=\"stat-box\">\n            <div class=\"stat-num green\">\u00a34,812<\/div>\n            <div class=\"stat-lbl\">Annual Subscription Spend<\/div>\n            <div class=\"stat-delta\">\u2191 \u00a3620 vs last year<\/div>\n          <\/div>\n          <div class=\"stat-box\">\n            <div class=\"stat-num amber\">2<\/div>\n            <div class=\"stat-lbl\">Pending Quote Requests <\/div>\n            <div class=\"stat-delta neg\">Awaiting review<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Two-col grid -->\n      <div style=\"display:grid;grid-template-columns:1fr 1fr;gap:20px\">\n\n        <!-- Recent orders -->\n        <div class=\"card\">\n          <div class=\"card-head\">\n            <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udce6<\/span> Recent Orders<\/div>\n            <button class=\"card-action\" onclick=\"showSection('orders')\">View all orders \u2192<\/button>\n          <\/div>\n          <div class=\"card-body\">\n            <div class=\"order-row\">\n              <div class=\"order-icon\">\ud83e\ude9f<\/div>\n              <div class=\"order-info\">\n                <div class=\"order-ref\">ORD-2025-0482<\/div>\n                <div class=\"order-detail\">Microsoft 365 Business Premium \u00b7 50 seats Annual licence<\/div>\n              <\/div>\n              <div class=\"order-amount\">\n                <div class=\"order-price\">\u00a31,340<\/div>\n                <div class=\"order-date\">12 May 2025<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"order-row\">\n              <div class=\"order-icon\">\ud83d\udee1\ufe0f<\/div>\n              <div class=\"order-info\">\n                <div class=\"order-ref\">ORD-2025-0441<\/div>\n                <div class=\"order-detail\">SentinelOne Singularity Core \u00b7 80 seats Annual licence<\/div>\n              <\/div>\n              <div class=\"order-amount\">\n                <div class=\"order-price\">\u00a3432<\/div>\n                <div class=\"order-date\">28 Apr 2025<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"order-row\">\n              <div class=\"order-icon\">\ud83d\udddd\ufe0f<\/div>\n              <div class=\"order-info\">\n                <div class=\"order-ref\">ORD-2025-0398<\/div>\n                <div class=\"order-detail\">1Password Business \u00b7 50 seats Annual licence<\/div>\n              <\/div>\n              <div class=\"order-amount\">\n                <div class=\"order-price\">\u00a3415<\/div>\n                <div class=\"order-date\">3 Apr 2025<\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <!-- Quick actions -->\n        <div class=\"card\">\n          <div class=\"card-head\">\n            <div class=\"card-title\"><span class=\"ct-icon\">\u26a1<\/span> Quick Actions<\/div>\n          <\/div>\n          <div class=\"card-body\">\n            <div class=\"qa-grid\">\n              <div class=\"qa-item\" onclick=\"showToast('Opening product catalogue\u2026','')\">\n                <div class=\"qa-icon\">\ud83d\uded2<\/div>\n                <div><div class=\"qa-label\">Shop Products<\/div><div class=\"qa-desc\">Browse 216 licensed solutions\n  <\/div><\/div>\n              <\/div>\n              <div class=\"qa-item\" onclick=\"showToast('Opening quote form\u2026','')\">\n                <div class=\"qa-icon\">\ud83d\udccb<\/div>\n                <div><div class=\"qa-label\">Request a Quote<\/div><div class=\"qa-desc\">Receive competitive pricing within 4 hours\n<\/div><\/div>\n              <\/div>\n              <div class=\"qa-item\" onclick=\"showSection('licences')\">\n                <div class=\"qa-icon\">\ud83d\udd04<\/div>\n                <div><div class=\"qa-label\">Renew Licences<\/div><div class=\"qa-desc\">2 licences expiring soon<\/div><\/div>\n              <\/div>\n              <div class=\"qa-item\" onclick=\"showToast('Opening support portal\u2026','')\">\n                <div class=\"qa-icon\">\ud83c\udfa7<\/div>\n                <div><div class=\"qa-label\">Get Support<\/div><div class=\"qa-desc\">Raise a support ticket\n<\/div><\/div>\n              <\/div>\n              <div class=\"qa-item\" onclick=\"showSection('orders')\">\n                <div class=\"qa-icon\">\ud83d\udcc4<\/div>\n                <div><div class=\"qa-label\">Download Invoices<\/div><div class=\"qa-desc\">VAT receipts available immediately\n<\/div><\/div>\n              <\/div>\n              <div class=\"qa-item\" onclick=\"showSection('security')\">\n                <div class=\"qa-icon\">\ud83d\udee1\ufe0f<\/div>\n                <div><div class=\"qa-label\">Security Settings<\/div><div class=\"qa-desc\">Manage MFA  &amp;  account access<\/div><\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Licence usage -->\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udcca<\/span> Licence Usage Summary<\/div>\n          <button class=\"card-action\" onclick=\"showSection('licences')\">Manage licences \u2192<\/button>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Seat utilisation by product<\/div>\n          <div class=\"usage-row\"><span class=\"usage-label\">Microsoft 365 Business Premium<\/span><div class=\"usage-bar-wrap\"><div class=\"usage-bar green\" style=\"width:86%\"><\/div><\/div><span class=\"usage-val\">43\/50 seats<\/span><\/div>\n          <div class=\"usage-row\"><span class=\"usage-label\">SentinelOne Singularity Core<\/span><div class=\"usage-bar-wrap\"><div class=\"usage-bar\" style=\"width:75%\"><\/div><\/div><span class=\"usage-val\">60\/80 seats<\/span><\/div>\n          <div class=\"usage-row\"><span class=\"usage-label\">1Password Business<\/span><div class=\"usage-bar-wrap\"><div class=\"usage-bar green\" style=\"width:92%\"><\/div><\/div><span class=\"usage-val\">46\/50 seats<\/span><\/div>\n          <div class=\"usage-row\"><span class=\"usage-label\">Cisco Duo MFA<\/span><div class=\"usage-bar-wrap\"><div class=\"usage-bar amber\" style=\"width:100%\"><\/div><\/div><span class=\"usage-val\">50\/50 seats<\/span><\/div>\n          <div class=\"usage-row\"><span class=\"usage-label\">Adobe Acrobat Pro<\/span><div class=\"usage-bar-wrap\"><div class=\"usage-bar\" style=\"width:40%\"><\/div><\/div><span class=\"usage-val\">8\/20 seats<\/span><\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n\n    <!-- \u2500\u2500 LICENCES \u2500\u2500 -->\n    <div id=\"section-licences\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udd11<\/span> My Licences<\/div>\n          <button class=\"card-action\" onclick=\"showToast('Opening product catalogue\u2026','')\">+ Add New Licence<\/button>\n        <\/div>\n        <div class=\"card-tabs\">\n          <button class=\"ctab active\" onclick=\"switchTab(this)\">All (8)<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">Active (6)<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">Expiring Soon (2)<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">Expired (0)<\/button>\n        <\/div>\n        <div style=\"padding:0 8px\">\n          <table class=\"licence-table\">\n            <thead class=\"lt-head\">\n              <tr>\n                <th style=\"padding-left:16px\">Product<\/th>\n                <th>Seats<\/th>\n                <th>Status<\/th>\n                <th>Renewal Date <\/th>\n                <th>Term remaining<\/th>\n                <th>Action<\/th>\n              <\/tr>\n            <\/thead>\n            <tbody>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83e\ude9f<\/div><div><div class=\"lt-prod-name\">Microsoft 365 Business Premium<\/div><div class=\"lt-prod-vendor\">Microsoft \u00b7 Cloud Subscription<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill expiring\"><span class=\"status-dot\"><\/span>Expiring Soon<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--amber);font-weight:600\">12 Jun 2025<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar warn\" style=\"width:8%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">18 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn\" onclick=\"showToast('\u2713 Renewal initiated \u2014 we'll be in touch shortly','success')\">Renew Now<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83d\udee1\ufe0f<\/div><div><div class=\"lt-prod-name\">SentinelOne Singularity Core<\/div><div class=\"lt-prod-vendor\">SentinelOne \u00b7 Endpoint Security<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">80<\/td>\n                <td><span class=\"status-pill expiring\"><span class=\"status-dot\"><\/span>Expiring Soon<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--amber);font-weight:600\">18 Jun 2025<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar warn\" style=\"width:13%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">24 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn\" onclick=\"showToast('\u2713 Renewal initiated \u2014 we'll be in touch shortly','success')\">Renew Now<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83d\udddd\ufe0f<\/div><div><div class=\"lt-prod-name\">1Password Business<\/div><div class=\"lt-prod-vendor\">1Password \u00b7 Identity &amp; Access<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill active\"><span class=\"status-dot\"><\/span>Active<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--g600)\">3 Apr 2026<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar green\" style=\"width:85%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">314 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote request sent for early renewal','success')\">Early Renew<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83d\udd10<\/div><div><div class=\"lt-prod-name\">Cisco Duo MFA<\/div><div class=\"lt-prod-vendor\">Cisco \u00b7 Multi-Factor Authentication<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill active\"><span class=\"status-dot\"><\/span>Active<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--g600)\">15 Jan 2026<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar green\" style=\"width:65%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">235 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote request sent for early renewal','success')\">Early Renew<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83d\udce7<\/div><div><div class=\"lt-prod-name\">Mimecast Email Security<\/div><div class=\"lt-prod-vendor\">Mimecast \u00b7 Email Security<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill active\"><span class=\"status-dot\"><\/span>Active<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--g600)\">22 Feb 2026<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar green\" style=\"width:72%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">273 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote request sent for early renewal','success')\">Early Renew<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83c\udfa8<\/div><div><div class=\"lt-prod-name\">Adobe Acrobat Pro<\/div><div class=\"lt-prod-vendor\">Adobe \u00b7 Software Licence<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">20<\/td>\n                <td><span class=\"status-pill active\"><span class=\"status-dot\"><\/span>Active<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--g600)\">8 Mar 2026<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar\" style=\"width:76%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">287 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote request sent for early renewal','success')\">Early Renew<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83d\udcbe<\/div><div><div class=\"lt-prod-name\">Veeam Backup for M365<\/div><div class=\"lt-prod-vendor\">Veeam \u00b7 Backup &amp; Recovery<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill active\"><span class=\"status-dot\"><\/span>Active<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--g600)\">19 Nov 2025<\/td>\n                <td><div class=\"progress-bar-wrap\"><div class=\"progress-bar amber\" style=\"width:45%\"><\/div><\/div><div style=\"font-size:10px;color:var(--g400);margin-top:3px\">178 days left<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote request sent for early renewal','success')\">Early Renew<\/button><\/td>\n              <\/tr>\n              <tr class=\"lt-row\">\n                <td><div class=\"lt-product\"><div class=\"lt-prod-icon\">\ud83c\udff0<\/div><div><div class=\"lt-prod-name\">Sophos Email Advanced<\/div><div class=\"lt-prod-vendor\">Sophos \u00b7 Email Security<\/div><\/div><\/div><\/td>\n                <td style=\"font-weight:600;color:var(--ink)\">50<\/td>\n                <td><span class=\"status-pill pending\"><span class=\"status-dot\"><\/span>Pending<\/span><\/td>\n                <td style=\"font-size:12px;color:var(--purple)\">Provisioning\u2026<\/td>\n                <td><div style=\"font-size:11.5px;color:var(--g400)\">Setting up<\/div><\/td>\n                <td><button class=\"lt-renew-btn outline\" style=\"opacity:0.5;cursor:default\">Pending<\/button><\/td>\n              <\/tr>\n            <\/tbody>\n          <\/table>\n        <\/div>\n        <div style=\"padding:16px 24px;border-top:1px solid var(--g100);display:flex;justify-content:space-between;align-items:center\">\n          <span style=\"font-size:12px;color:var(--g400)\">Showing 8 of 8 licences<\/span>\n          <button class=\"lt-renew-btn\" onclick=\"showToast('Renewal quotes requested for all expiring licences','success')\">\ud83d\udd04 Renew All Expiring<\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 ORDERS \u2500\u2500 -->\n    <div id=\"section-orders\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udce6<\/span> Orders &amp; Invoices<\/div>\n          <button class=\"card-action\" onclick=\"showToast('Downloading all invoices as ZIP\u2026','success')\">\u2b07 Export All PDF<\/button>\n        <\/div>\n        <div class=\"card-tabs\">\n          <button class=\"ctab active\" onclick=\"switchTab(this)\">All Orders<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">2025<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">2024<\/button>\n          <button class=\"ctab\" onclick=\"switchTab(this)\">Invoices Only<\/button>\n        <\/div>\n        <div class=\"card-body\">\n          <div id=\"orders-list\">\n            <!-- Orders rendered by JS -->\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 QUOTES \u2500\u2500 -->\n    <div id=\"section-quotes\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udccb<\/span> Quote Requests<\/div>\n          <button class=\"card-action\" onclick=\"showToast('Opening quote form\u2026','')\">+ Request a New Quote\n<\/button>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Recent Requests<\/div>\n          <div class=\"quote-row\">\n            <div style=\"width:40px;height:40px;background:var(--amber-lt);border-radius:var(--r10);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0\">\ud83d\udccb<\/div>\n            <div class=\"quote-info\">\n              <div class=\"quote-ref\">QT-2025-0089 <span class=\"status-pill pending\" style=\"font-size:9.5px;padding:2px 8px;vertical-align:middle\">Pending Quotes<\/span><\/div>\n              <div class=\"quote-products\">CrowdStrike Falcon Enterprise (80 seats), Huntress Managed EDR (80 seats)<\/div>\n              <div style=\"font-size:11px;color:var(--g400);margin-top:3px\">Submitted 22 May 2025 \u00b7 Awaiting pricing from our team Submitted 22 May 2025 \u00b7 Under review \u2014 our team will respond within 4 business hours\n<\/div>\n            <\/div>\n            <div class=\"quote-actions\">\n              <button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote details opened','')\">View<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"quote-row\">\n            <div style=\"width:40px;height:40px;background:var(--amber-lt);border-radius:var(--r10);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0\">\ud83d\udccb<\/div>\n            <div class=\"quote-info\">\n              <div class=\"quote-ref\">QT-2025-0076 <span class=\"status-pill pending\" style=\"font-size:9.5px;padding:2px 8px;vertical-align:middle\">Pending Quotes<\/span><\/div>\n              <div class=\"quote-products\">Zscaler Internet Access (50 seats), Zscaler Private Access (50 seats)<\/div>\n              <div style=\"font-size:11px;color:var(--g400);margin-top:3px\">Submitted 14 May 2025 \u00b7 Under review \u2014 pricing being prepared by your account manager\n<\/div>\n            <\/div>\n            <div class=\"quote-actions\">\n              <button class=\"lt-renew-btn outline\" onclick=\"showToast('Quote details opened','')\">View<\/button>\n            <\/div>\n          <\/div>\n          <div style=\"border-top:1px solid var(--g100);padding-top:16px;margin-top:4px\">\n            <div class=\"section-label\">Previous Quotes<\/div>\n            <div class=\"quote-row\">\n              <div style=\"width:40px;height:40px;background:var(--green-lt);border-radius:var(--r10);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0\">\u2705<\/div>\n              <div class=\"quote-info\">\n                <div class=\"quote-ref\">QT-2025-0041 <span class=\"status-pill active\" style=\"font-size:9.5px;padding:2px 8px;vertical-align:middle\">Accepted<\/span><\/div>\n                <div class=\"quote-products\">1Password Business (50 seats) \u2014 \u00a36.99\/user\/month<\/div>\n                <div style=\"font-size:11px;color:var(--g400);margin-top:3px\">Submitted 28 Mar 2025 \u00b7 Order placed 3 Apr 2025<\/div>\n              <\/div>\n              <div class=\"quote-actions\">\n                <button class=\"lt-renew-btn outline\" onclick=\"showToast('Opening invoice INV-2025-0398\u2026','')\">Invoice<\/button>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 PROFILE \u2500\u2500 -->\n    <div id=\"section-profile\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udc64<\/span> Profile &amp; Company Details<\/div>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Personal Information<\/div>\n          <div class=\"profile-grid\" style=\"margin-bottom:24px\">\n            <div class=\"form-group\">\n              <label class=\"form-label\">First Name<\/label>\n              <input class=\"form-input\" value=\"James\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Last Name<\/label>\n              <input class=\"form-input\" value=\"Wilson\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Email Address<\/label>\n              <input class=\"form-input\" value=\"j.wilson@meridiansolutions.co.uk\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Phone Number<\/label>\n              <input class=\"form-input\" value=\"+44 7700 123456\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Job Title<\/label>\n              <input class=\"form-input\" value=\"IT Manager\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Department<\/label>\n              <input class=\"form-input\" value=\"IT &amp; Operations\">\n            <\/div>\n          <\/div>\n          <div class=\"section-label\">Company Details<\/div>\n          <div class=\"profile-grid\">\n            <div class=\"form-group full\">\n              <label class=\"form-label\">Company Name<\/label>\n              <input class=\"form-input\" value=\"Meridian Solutions Ltd\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Company Registration No.<\/label>\n              <input class=\"form-input\" value=\"08724531\" readonly>\n              <span class=\"form-hint\">Contact us to update company number<\/span>\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">VAT Number<\/label>\n              <input class=\"form-input\" value=\"GB 234 567 891\">\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Industry<\/label>\n              <select class=\"form-select\">\n                <option selected>Professional Services<\/option>\n                <option>Financial Services<\/option>\n                <option>Technology &amp; MSP<\/option>\n                <option>Healthcare<\/option>\n                <option>Manufacturing<\/option>\n              <\/select>\n            <\/div>\n            <div class=\"form-group\">\n              <label class=\"form-label\">Company Size<\/label>\n              <select class=\"form-select\">\n                <option>11\u201350 users<\/option>\n                <option selected>51\u2013100 users<\/option>\n                <option>101\u2013250 users<\/option>\n              <\/select>\n            <\/div>\n            <div class=\"form-group full\">\n              <label class=\"form-label\">Billing Address<\/label>\n              <input class=\"form-input\" value=\"12 King Street, London, EC2V 8EA\">\n            <\/div>\n          <\/div>\n          <div style=\"display:flex;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <button class=\"save-btn\" onclick=\"showToast('\u2713 Profile updated successfully','success')\">Save Changes<\/button>\n            <button class=\"cancel-btn\">Cancel<\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 SECURITY \u2500\u2500 -->\n    <div id=\"section-security\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udee1\ufe0f<\/span> Security Settings<\/div>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Authentication<\/div>\n          <div class=\"sec-item\">\n            <div class=\"sec-item-icon green-bg\">\ud83d\udd11<\/div>\n            <div class=\"sec-item-info\">\n              <div class=\"sec-item-label\">Password<\/div>\n              <div class=\"sec-item-desc\">Last changed 14 January 2025 \u00b7 Password strength: Strong<\/div>\n            <\/div>\n            <button class=\"lt-renew-btn outline\" onclick=\"showToast('Password reset email sent to your address','success')\">Change Password<\/button>\n          <\/div>\n          <div class=\"sec-item\">\n            <div class=\"sec-item-icon green-bg\">\ud83d\udcf1<\/div>\n            <div class=\"sec-item-info\">\n              <div class=\"sec-item-label\">Two-Factor Authentication (2FA)<\/div>\n              <div class=\"sec-item-desc\">Authenticator app enabled \u00b7 Last used: today<\/div>\n            <\/div>\n            <label class=\"tog\"><input type=\"checkbox\" checked onchange=\"showToast(this.checked?'2FA enabled':'2FA disabled \u2014 your account is less secure',this.checked?'success':'error')\"><div class=\"track\"><\/div><\/label>\n          <\/div>\n          <div class=\"sec-item\">\n            <div class=\"sec-item-icon blue-bg\">\ud83d\udce7<\/div>\n            <div class=\"sec-item-info\">\n              <div class=\"sec-item-label\">Login Notifications<\/div>\n              <div class=\"sec-item-desc\">Receive an email whenever your account is accessed from a new device<\/div>\n            <\/div>\n            <label class=\"tog\"><input type=\"checkbox\" checked onchange=\"showToast(this.checked?'Login notifications enabled':'Login notifications disabled','')\"><div class=\"track\"><\/div><\/label>\n          <\/div>\n          <div style=\"margin-top:20px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <div class=\"section-label\">Active Sessions<\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-icon green-bg\">\ud83d\udcbb<\/div>\n              <div class=\"sec-item-info\">\n                <div class=\"sec-item-label\">Windows PC \u2014 Chrome 124 <span style=\"background:var(--green-lt);color:var(--green);font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;margin-left:6px\">Current<\/span><\/div>\n                <div class=\"sec-item-desc\">London, UK \u00b7 Active now<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-icon amber-bg\">\ud83d\udcf1<\/div>\n              <div class=\"sec-item-info\">\n                <div class=\"sec-item-label\">iPhone 15 \u2014 Safari<\/div>\n                <div class=\"sec-item-desc\">London, UK \u00b7 Last active 2 hours ago<\/div>\n              <\/div>\n              <button class=\"lt-renew-btn outline\" style=\"color:var(--red);border-color:var(--red)\" onclick=\"showToast('Session revoked successfully','success')\">Revoke<\/button>\n            <\/div>\n          <\/div>\n          <div style=\"margin-top:20px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <button class=\"lt-renew-btn outline\" style=\"color:var(--red);border-color:var(--red)\" onclick=\"showToast('All other sessions revoked','success')\">Sign Out All Other Devices<\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 NOTIFICATIONS \u2500\u2500 -->\n    <div id=\"section-notifications\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udd14<\/span> Notification Preferences<\/div>\n          <button class=\"card-action\" onclick=\"showToast('All notifications marked as read','success')\">Mark all read<\/button>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Recent Notifications<\/div>\n          <div class=\"notif-item\">\n            <div class=\"notif-dot\"><\/div>\n            <div class=\"notif-body\">\n              <div class=\"notif-title\">\u26a0\ufe0f Licence Expiring \u2014 Microsoft 365 Business Premium<\/div>\n              <div class=\"notif-desc\">Your Microsoft 365 Business Premium licence for 50 seats expires in 18 days.             Renew now to prevent disruption to your team's productivity.\n<\/div>\n            <\/div>\n            <div class=\"notif-time\">Today<\/div>\n          <\/div>\n          <div class=\"notif-item\">\n            <div class=\"notif-dot\"><\/div>\n            <div class=\"notif-body\">\n              <div class=\"notif-title\">\ud83d\udccb Quote Request Update \u2014 QT-2025-0089<\/div>\n              <div class=\"notif-desc\">Your quote for CrowdStrike Falcon Enterprise and Huntress Managed EDR is currently under review by your dedicated account manager.\n<\/div>\n            <\/div>\n            <div class=\"notif-time\">Yesterday<\/div>\n          <\/div>\n          <div class=\"notif-item\">\n            <div class=\"notif-dot read\"><\/div>\n            <div class=\"notif-body\">\n              <div class=\"notif-title\" style=\"color:var(--g600)\">\u2705 Order Confirmed \u2014 ORD-2025-0482<\/div>\n              <div class=\"notif-desc\">Your order for Microsoft 365 Business Premium (50 seats) has been successfully provisioned.\n            Your licence keys are now active.\n<\/div>\n            <\/div>\n            <div class=\"notif-time\">12 May<\/div>\n          <\/div>\n          <div style=\"margin-top:24px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <div class=\"section-label\">Email Preferences<\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-info\"><div class=\"sec-item-label\">Licence Renewal Reminders<\/div><div class=\"sec-item-desc\">90, 30, 14 and 7 days before expiry<\/div><\/div>\n              <label class=\"tog\"><input type=\"checkbox\" checked onchange=\"showToast('Preference saved','success')\"><div class=\"track\"><\/div><\/label>\n            <\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-info\"><div class=\"sec-item-label\">Order Confirmations &amp; Invoices<\/div><div class=\"sec-item-desc\">Immediately when orders are placed or invoices issued<\/div><\/div>\n              <label class=\"tog\"><input type=\"checkbox\" checked onchange=\"showToast('Preference saved','success')\"><div class=\"track\"><\/div><\/label>\n            <\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-info\"><div class=\"sec-item-label\">Quote Status Updates<\/div><div class=\"sec-item-desc\">When your quote requests are updated or pricing is ready<\/div><\/div>\n              <label class=\"tog\"><input type=\"checkbox\" checked onchange=\"showToast('Preference saved','success')\"><div class=\"track\"><\/div><\/label>\n            <\/div>\n            <div class=\"sec-item\">\n              <div class=\"sec-item-info\"><div class=\"sec-item-label\">Product &amp; Deal Announcements<\/div><div class=\"sec-item-desc\">New products, vendor promotions and exclusive discounts<\/div><\/div>\n              <label class=\"tog\"><input type=\"checkbox\" onchange=\"showToast('Preference saved','success')\"><div class=\"track\"><\/div><\/label>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- \u2500\u2500 BILLING \u2500\u2500 -->\n    <div id=\"section-billing\" style=\"display:none\">\n      <div class=\"card\">\n        <div class=\"card-head\">\n          <div class=\"card-title\"><span class=\"ct-icon\">\ud83d\udcb3<\/span> Billing &amp; Payment<\/div>\n          <button class=\"card-action\" onclick=\"showToast('Opening payment method form\u2026','')\">+ Add Payment Method<\/button>\n        <\/div>\n        <div class=\"card-body\">\n          <div class=\"section-label\">Saved Payment Methods<\/div>\n          <div class=\"sec-item\">\n            <div class=\"sec-item-icon blue-bg\" style=\"font-size:22px\">\ud83d\udcb3<\/div>\n            <div class=\"sec-item-info\">\n              <div class=\"sec-item-label\">Visa ending in 4821 <span style=\"background:var(--green-lt);color:var(--green);font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;margin-left:6px\">Default<\/span><\/div>\n              <div class=\"sec-item-desc\">Expires 09\/2027 \u00b7 Meridian Solutions Ltd<\/div>\n            <\/div>\n            <button class=\"lt-renew-btn outline\" onclick=\"showToast('Card settings opened','')\">Manage Card<\/button>\n          <\/div>\n          <div class=\"sec-item\">\n            <div class=\"sec-item-icon blue-bg\" style=\"font-size:22px\">\ud83c\udfe6<\/div>\n            <div class=\"sec-item-info\">\n              <div class=\"sec-item-label\">BACS Bank Transfer<\/div>\n              <div class=\"sec-item-desc\">30-day payment terms approved \u00b7 Sort: 20-30-41 \u00b7 Account: \u2022\u2022\u2022\u20227823<\/div>\n            <\/div>\n            <button class=\"lt-renew-btn outline\" onclick=\"showToast('Bank details copied to clipboard','success')\">Copy Bank Details<\/button>\n          <\/div>\n          <div style=\"margin-top:20px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <div class=\"section-label\">Billing Summary<\/div>\n            <div style=\"background:var(--g50);border:1.5px solid var(--g100);border-radius:var(--r10);padding:20px\">\n              <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:12px\">\n                <span style=\"font-size:13px;color:var(--g600)\">Total active subscriptions<\/span><span style=\"font-weight:700;color:var(--ink)\">\u00a34,812.00 \/ year<\/span>\n              <\/div>\n              <div style=\"display:flex;justify-content:space-between;align-items:center;margin-bottom:12px\">\n                <span style=\"font-size:13px;color:var(--g600)\">Next renewal payment<\/span><span style=\"font-weight:700;color:var(--amber)\">\u00a31,340.00 on 12 Jun 2025<\/span>\n              <\/div>\n              <div style=\"display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid var(--g200)\">\n                <span style=\"font-size:13px;color:var(--g600)\">Account credit balance<\/span><span style=\"font-weight:700;color:var(--green)\">\u00a30.00<\/span>\n              <\/div>\n            <\/div>\n          <\/div>\n          <div style=\"display:flex;gap:10px;margin-top:20px;padding-top:20px;border-top:1px solid var(--g100)\">\n            <button class=\"save-btn\" onclick=\"showToast('Opening invoice history\u2026','')\">\ud83d\udcc4 Download All Invoices<\/button>\n            <button class=\"cancel-btn\" onclick=\"showToast('Spending report emailed to you','success')\">\ud83d\udcca Request Spending Report<\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n  <\/main>\n<\/div>\n\n\n\n<div class=\"toast\" id=\"toast\"><\/div>\n\n<script>\n\/\/ \u2500\u2500 ORDERS DATA \u2500\u2500\nconst ORDERS = [\n  {ref:'ORD-2025-0482',icon:'\ud83e\ude9f',name:'Microsoft 365 Business Premium',detail:'50 seats \u00b7 Annual',price:'\u00a31,340.00',date:'12 May 2025',status:'active'},\n  {ref:'ORD-2025-0441',icon:'\ud83d\udee1\ufe0f',name:'SentinelOne Singularity Core',detail:'80 seats \u00b7 Annual',price:'\u00a3432.00',date:'28 Apr 2025',status:'active'},\n  {ref:'ORD-2025-0398',icon:'\ud83d\udddd\ufe0f',name:'1Password Business',detail:'50 seats \u00b7 Annual',price:'\u00a3415.80',date:'3 Apr 2025',status:'active'},\n  {ref:'ORD-2025-0344',icon:'\ud83d\udce7',name:'Mimecast Email Security',detail:'50 seats \u00b7 Annual',price:'\u00a3598.00',date:'22 Feb 2025',status:'active'},\n  {ref:'ORD-2025-0289',icon:'\ud83d\udd10',name:'Cisco Duo MFA',detail:'50 seats \u00b7 Annual',price:'\u00a3216.00',date:'15 Jan 2025',status:'active'},\n  {ref:'ORD-2024-0891',icon:'\ud83c\udfa8',name:'Adobe Acrobat Pro',detail:'20 seats \u00b7 Annual',price:'\u00a31,149.60',date:'8 Mar 2024',status:'active'},\n  {ref:'ORD-2024-0762',icon:'\ud83d\udcbe',name:'Veeam Backup for M365',detail:'50 seats \u00b7 Annual',price:'\u00a3360.00',date:'19 Nov 2024',status:'active'},\n];\n\nfunction renderOrders() {\n  const list = document.getElementById('orders-list');\n  if (!list) return;\n  list.innerHTML = ORDERS.map(o => `\n    <div class=\"order-row\">\n      <div class=\"order-icon\">${o.icon}<\/div>\n      <div class=\"order-info\">\n        <div class=\"order-ref\">${o.ref} <span class=\"status-pill active\" style=\"font-size:9.5px;padding:2px 8px;vertical-align:middle\"><span class=\"status-dot\"><\/span>Completed<\/span><\/div>\n        <div class=\"order-detail\">${o.name} \u00b7 ${o.detail}<\/div>\n      <\/div>\n      <div class=\"order-amount\">\n        <div class=\"order-price\">${o.price}<\/div>\n        <div class=\"order-date\">${o.date}<\/div>\n      <\/div>\n      <button class=\"lt-renew-btn outline\" style=\"flex-shrink:0\" onclick=\"showToast('Downloading invoice for ${o.ref}\u2026','success')\">\u2b07 Download  Invoice<\/button>\n    <\/div>\n  `).join('');\n}\n\n\/\/ \u2500\u2500 SECTION NAVIGATION \u2500\u2500\nconst sections = ['overview','licences','orders','quotes','profile','security','notifications','billing'];\n\nfunction showSection(id) {\n  sections.forEach(s => {\n    const el = document.getElementById('section-' + s);\n    if (el) el.style.display = (s === id) ? 'flex' : 'none';\n    if (el && s === id) el.style.display = '';\n  });\n  \/\/ Set all to hidden then show target\n  sections.forEach(s => {\n    const el = document.getElementById('section-' + s);\n    if (el) el.style.display = 'none';\n  });\n  const target = document.getElementById('section-' + id);\n  if (target) target.style.display = '';\n\n  \/\/ Update sidebar\n  document.querySelectorAll('.acc-nav-item').forEach(el => el.classList.remove('active'));\n  const navEl = document.getElementById('nav-' + id);\n  if (navEl) navEl.classList.add('active');\n\n  \/\/ Render orders on demand\n  if (id === 'orders') renderOrders();\n  window.scrollTo({top: 0, behavior: 'smooth'});\n}\n\nfunction switchTab(btn) {\n  const tabs = btn.closest('.card-tabs').querySelectorAll('.ctab');\n  tabs.forEach(t => t.classList.remove('active'));\n  btn.classList.add('active');\n}\n\nfunction showToast(msg, type) {\n  const t = document.getElementById('toast');\n  t.textContent = msg;\n  t.className = 'toast' + (type ? ' ' + type : '');\n  t.classList.add('show');\n  setTimeout(() => t.classList.remove('show'), 3000);\n}\n\n\/\/ Init\nshowSection('overview');\n<\/script>\n<\/body>\n<\/html><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>My Account \u2014 BritHaven Tech JW James Wilson \ud83c\udfe2 Meridian Solutions Ltd \u2709\ufe0f j.wilson@meridiansolutions.co.uk \u2b50 Premium Account \ud83d\udcac Contact Support \u270f\ufe0f Edit Profile Account \ud83c\udfe0 Overview \ud83d\udd11 My Licences 8 \ud83d\udce6 Orders &amp; Invoices \ud83d\udccb Quote Requests 2 Settings \ud83d\udc64 Profile &amp; Company \ud83d\udee1\ufe0f Security \ud83d\udd14 Notifications \ud83d\udcb3 Billing &amp; Payment \ud83d\udeaa Sign Out \u26a0\ufe0f [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-216","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Accounts - Brithaventech<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/brithaventech.co.uk\/index.php\/accounts\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Accounts - Brithaventech\" \/>\n<meta property=\"og:description\" content=\"My Account \u2014 BritHaven Tech JW James Wilson \ud83c\udfe2 Meridian Solutions Ltd \u2709\ufe0f j.wilson@meridiansolutions.co.uk \u2b50 Premium Account \ud83d\udcac Contact Support \u270f\ufe0f Edit Profile Account \ud83c\udfe0 Overview \ud83d\udd11 My Licences 8 \ud83d\udce6 Orders &amp; Invoices \ud83d\udccb Quote Requests 2 Settings \ud83d\udc64 Profile &amp; Company \ud83d\udee1\ufe0f Security \ud83d\udd14 Notifications \ud83d\udcb3 Billing &amp; Payment \ud83d\udeaa Sign Out \u26a0\ufe0f [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/brithaventech.co.uk\/index.php\/accounts\/\" \/>\n<meta property=\"og:site_name\" content=\"Brithaventech\" \/>\n<meta property=\"article:modified_time\" content=\"2026-05-26T09:52:13+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"19 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/brithaventech.co.uk\\\/index.php\\\/accounts\\\/\",\"url\":\"https:\\\/\\\/brithaventech.co.uk\\\/index.php\\\/accounts\\\/\",\"name\":\"Accounts - Brithaventech\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/brithaventech.co.uk\\\/#website\"},\"datePublished\":\"2026-05-25T11:08:44+00:00\",\"dateModified\":\"2026-05-26T09:52:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/brithaventech.co.uk\\\/index.php\\\/accounts\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/brithaventech.co.uk\\\/index.php\\\/accounts\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/brithaventech.co.uk\\\/index.php\\\/accounts\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/brithaventech.co.uk\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Accounts\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/brithaventech.co.uk\\\/#website\",\"url\":\"https:\\\/\\\/brithaventech.co.uk\\\/\",\"name\":\"Brithaventech\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/brithaventech.co.uk\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Accounts - Brithaventech","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/","og_locale":"en_US","og_type":"article","og_title":"Accounts - Brithaventech","og_description":"My Account \u2014 BritHaven Tech JW James Wilson \ud83c\udfe2 Meridian Solutions Ltd \u2709\ufe0f j.wilson@meridiansolutions.co.uk \u2b50 Premium Account \ud83d\udcac Contact Support \u270f\ufe0f Edit Profile Account \ud83c\udfe0 Overview \ud83d\udd11 My Licences 8 \ud83d\udce6 Orders &amp; Invoices \ud83d\udccb Quote Requests 2 Settings \ud83d\udc64 Profile &amp; Company \ud83d\udee1\ufe0f Security \ud83d\udd14 Notifications \ud83d\udcb3 Billing &amp; Payment \ud83d\udeaa Sign Out \u26a0\ufe0f [&hellip;]","og_url":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/","og_site_name":"Brithaventech","article_modified_time":"2026-05-26T09:52:13+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"19 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/","url":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/","name":"Accounts - Brithaventech","isPartOf":{"@id":"https:\/\/brithaventech.co.uk\/#website"},"datePublished":"2026-05-25T11:08:44+00:00","dateModified":"2026-05-26T09:52:13+00:00","breadcrumb":{"@id":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/brithaventech.co.uk\/index.php\/accounts\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/brithaventech.co.uk\/index.php\/accounts\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/brithaventech.co.uk\/"},{"@type":"ListItem","position":2,"name":"Accounts"}]},{"@type":"WebSite","@id":"https:\/\/brithaventech.co.uk\/#website","url":"https:\/\/brithaventech.co.uk\/","name":"Brithaventech","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/brithaventech.co.uk\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/pages\/216","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/comments?post=216"}],"version-history":[{"count":10,"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/pages\/216\/revisions"}],"predecessor-version":[{"id":248,"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/pages\/216\/revisions\/248"}],"wp:attachment":[{"href":"https:\/\/brithaventech.co.uk\/index.php\/wp-json\/wp\/v2\/media?parent=216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}