/* JoomlaX Support – jx2 client theme. Flat: no gradients, shadows or transparency. */
:root{--jx-brand:#1819ED;--jx-tint:#F3F4FD;--jx-text:#111827;--jx-muted:#4B5563;--jx-faint:#6B7280;--jx-line:#E5E7EB;--jx-input:#D1D5DB}
body.jx2{font-family:'DM Sans',sans-serif!important;color:var(--jx-text);background:#fff!important;line-height:1.55;margin:0;font-size:16px}
.jx2 *,.jx2 *:before,.jx2 *:after{box-sizing:border-box;box-shadow:none!important;text-shadow:none!important}
.jx2 #container{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;background:#fff!important;border:0!important}
.jx2 #content{padding:0!important;margin:0!important;width:auto!important;min-height:0}
.jx2 a{color:var(--jx-brand)}
.jx2 h1,.jx2 h2,.jx2 h3{font-family:'DM Sans',sans-serif;color:var(--jx-text);font-weight:700;margin:0}
.jx2-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
/* header */
.jx2-header{border-bottom:1px solid var(--jx-line);background:#fff}
.jx2-header__inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.jx2-logo{font-weight:700;font-size:22px;color:var(--jx-text)!important;text-decoration:none!important;white-space:nowrap}
.jx2-logo span{color:var(--jx-brand)}
.jx2-nav a{margin-left:28px;color:#374151;text-decoration:none;font-weight:500}
.jx2-nav a.on,.jx2-nav a:hover{color:var(--jx-brand)}
/* buttons */
.jx2-btn{display:inline-block;text-align:center;padding:12px 20px;border-radius:8px;font-weight:700;text-decoration:none!important;border:2px solid var(--jx-brand);color:var(--jx-brand)!important;background:#fff}
.jx2-btn--solid{background:var(--jx-brand);color:#fff!important}
.jx2-btn--big{padding:15px 28px;font-size:17px}
.jx2-btn i{margin-right:6px}
.jx2-mt{margin-top:20px}.jx2-mt-s{margin-top:12px}
/* home */
.jx2-hero{background:var(--jx-tint);padding:72px 0;text-align:center}
.jx2-hero h1{font-size:44px;line-height:1.15;margin-bottom:12px}
.jx2-hero p{color:var(--jx-muted);font-size:18px;margin:0 0 28px}
.jx2-hero p.jx2-docs{margin:24px 0 0;font-size:16px}
.jx2-acts{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.jx2-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:56px 0}
.jx2-card{border:1px solid var(--jx-line);border-radius:12px;padding:28px;display:flex;flex-direction:column;background:#fff}
.jx2-card--primary{border:2px solid var(--jx-brand)}
.jx2-ic{width:44px;height:44px;border-radius:10px;background:var(--jx-tint);color:var(--jx-brand);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:16px}
.jx2-card h2{font-size:21px;margin-bottom:8px}
.jx2-card p{color:var(--jx-muted);flex:1;margin:0 0 20px}
.jx2-how{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:48px 0;border-top:1px solid var(--jx-line)}
.jx2-how h3{font-size:24px;margin-bottom:14px}
.jx2-how ol{padding-left:22px;color:#374151;margin:0}.jx2-how li{margin-bottom:10px}
.jx2-how p{color:#374151;margin:0}
.jx2-note{background:var(--jx-tint);border-radius:10px;padding:16px 20px;margin-top:16px;color:#374151}
/* inner pages */
.jx2-ph{background:var(--jx-tint);padding:44px 0}
.jx2-ph h1{font-size:38px;margin-bottom:6px}
.jx2-ph p{color:var(--jx-muted);margin:0}
.jx2-req{color:#DC2626}
.jx2-opt{color:var(--jx-faint);font-weight:400;font-size:14px}
.jx2-lay{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;margin-top:40px;margin-bottom:40px;align-items:start}
.jx2 form#ticketForm,.jx2 form#clientLogin{display:block;border:0;padding:0;margin:0;max-width:none;width:auto;background:none}
.jx2-group{border:1px solid var(--jx-line);border-radius:12px;padding:28px;margin:0 0 24px;background:#fff;min-width:0}
.jx2-group legend{font-weight:700;font-size:20px;padding:0 8px;width:auto;border:0;margin:0;color:var(--jx-text)}
.jx2-sub,.jx2-sub p{color:var(--jx-faint);margin:-4px 0 18px}
.jx2-fields--2{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.jx2-f{margin-bottom:20px;min-width:0}
.jx2-f:last-child{margin-bottom:0}
.jx2-f label,.jx2-group label{display:block;font-weight:500;margin-bottom:6px;color:var(--jx-text);font-size:16px}
.jx2-form-head{margin:4px 0 18px}
#dynamic-form .jx2-form-head:first-child h3{display:none}
#dynamic-form .jx2-form-head h3{font-size:18px;margin-bottom:6px}
.jx2 input[type=text],.jx2 input[type=email],.jx2 input[type=tel],.jx2 input[type=number],.jx2 input[type=password],.jx2 select,.jx2 textarea{width:100%!important;max-width:100%;border:1px solid var(--jx-input)!important;border-radius:8px!important;padding:12px 14px!important;font:inherit;font-size:16px!important;background:#fff!important;color:var(--jx-text);height:auto!important;line-height:1.4}
.jx2 input:focus,.jx2 select:focus,.jx2 textarea:focus{outline:2px solid var(--jx-brand)!important;border-color:var(--jx-brand)!important}
.jx2 input.dp{width:auto!important;min-width:220px}
.jx2 .ui-datepicker-trigger{vertical-align:middle;margin-left:8px;cursor:pointer}
.jx2-f .faded{color:var(--jx-faint);margin-left:6px}
.jx2-hint,.jx2-hint p{color:var(--jx-faint);font-size:14px;margin:6px 0 0}
.jx2-static{padding:12px 0}
.jx2 .error,.jx2-error{color:#DC2626;font-size:14px;margin-top:6px}
.jx2 textarea{min-height:180px;resize:vertical}
/* select2 */
.jx2 .select2-container--default .select2-selection--single{border:1px solid var(--jx-input)!important;border-radius:8px!important;height:48px!important;background:#fff}
.jx2 .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:46px!important;padding-left:14px;color:var(--jx-text)}
.jx2 .select2-container--default .select2-selection--single .select2-selection__arrow{height:46px!important;right:8px}
.select2-dropdown{border-color:var(--jx-input)!important;font-family:'DM Sans',sans-serif}
.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted{background:var(--jx-brand)!important;color:#fff!important}
/* redactor + filedrop */
.jx2 .redactor-box,.jx2 .redactor-box.redactor-styles-on{border:1px solid var(--jx-input)!important;border-radius:8px!important;overflow:hidden;background:#fff;margin-bottom:0}
.jx2 .redactor-toolbar{background:#fff!important;border-bottom:1px solid var(--jx-line)}
.jx2 .redactor-styles{font-family:'DM Sans',sans-serif!important;min-height:180px}
.jx2 .filedrop{margin-top:12px}
.jx2 .filedrop .dropzone{border:2px dashed #C7C8F7!important;border-radius:10px!important;padding:22px!important;text-align:center;color:var(--jx-muted);background:var(--jx-tint)!important}
.jx2 .filedrop .dropzone a{font-weight:700}
.jx2 .filedrop .files{border:0!important;background:none}
/* actions */
.jx2-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0}
.jx2-actions input{font:inherit;font-weight:700;border-radius:8px;padding:14px 22px;cursor:pointer;font-size:16px;height:auto;line-height:1.2}
.jx2 input.jx2-submit{background:var(--jx-brand)!important;color:#fff!important;border:2px solid var(--jx-brand)!important;padding:16px 40px;font-size:17px}
.jx2 input.jx2-secondary{background:#fff!important;color:#374151!important;border:1px solid var(--jx-input)!important}
.jx2-footnote{margin-top:16px;color:var(--jx-muted)}
/* aside */
.jx2-aside .jx2-box{border:1px solid var(--jx-line);border-radius:12px;padding:24px;margin-bottom:20px;background:#fff}
.jx2-aside h3{font-size:18px;margin-bottom:10px}
.jx2-aside p{color:var(--jx-muted);font-size:15px;margin:0}
.jx2-aside .jx2-box--blue{background:var(--jx-tint);border-color:var(--jx-tint)}
/* messages */
.jx2 #msg_error,.jx2 #msg_notice,.jx2 #msg_warning{margin:20px auto 0;max-width:1152px;border-radius:8px;padding:12px 16px;background-image:none!important}
.jx2 #msg_notice{background:var(--jx-tint);color:var(--jx-text);border:1px solid #C7C8F7}
.jx2 .error_bar,.jx2 .warning_bar,.jx2 .notice_bar{background-image:none!important}
/* ticket view / list pages keep osTicket markup inside the frame */
.jx2 #content > h1,.jx2 #content > table,.jx2 #content > form:not(#ticketForm):not(#clientLogin),.jx2 #content > div:not(.jx2-wrap):not(#landing_page):not(.jx2-lay),.jx2 #content > p,.jx2 #content > .thread-body{max-width:1152px;margin-left:auto;margin-right:auto}
.jx2 #content > h1:first-child{margin-top:40px}
.jx2 .button,.jx2 input[type=submit]:not(.jx2-submit):not(.jx2-secondary),.jx2 button.button{background:var(--jx-brand)!important;color:#fff!important;border:2px solid var(--jx-brand)!important;border-radius:8px!important;background-image:none!important;font:inherit;font-weight:700}
/* footer */
.jx2-footer{border-top:1px solid var(--jx-line);padding:28px 0;color:var(--jx-faint);font-size:14px;margin-top:40px;background:#fff;width:auto!important;text-align:left}
.jx2 #poweredBy{display:none!important}
@media(max-width:960px){.jx2-lay{grid-template-columns:1fr}.jx2-fields--2{grid-template-columns:1fr}.jx2-ph h1{font-size:30px}.jx2-group{padding:20px}.jx2 input.jx2-submit{width:100%}}
@media(max-width:860px){.jx2-nav{display:none}.jx2-hero h1{font-size:32px}.jx2-hero{padding:48px 0}.jx2-cards,.jx2-how{grid-template-columns:1fr}.jx2-cards{margin:36px 0}.jx2-acts .jx2-btn{width:100%}}
.jx2 select.select2-hidden-accessible{width:1px!important;height:1px!important;padding:0!important;border:0!important}
.jx2-footer,.jx2-footer .jx2-wrap{text-align:left!important}
.jx2-footer{height:auto!important}
.jx2 input.jx2-submit{padding:16px 40px!important;font-size:17px!important;height:auto!important;border-radius:8px!important}
.jx2 #footer.jx2-footer{text-align:left!important}
.jx2-fields--2{align-items:start}
.jx2 #logo{float:none!important;height:auto!important;width:auto!important;margin:0!important;padding:0!important;line-height:1.2!important;display:block!important}
/* v5: logo image, no dotted underlines, select font, block labels */
.jx2 .jx2-logo{display:flex!important;align-items:center;gap:10px}
.jx2 .jx2-logo img{height:33px;width:auto;display:block}
.jx2 .jx2-logo .jx2-logo-sub{color:var(--jx-text);font-weight:600;font-size:18px;padding-left:10px;border-left:1px solid var(--jx-input)}
.jx2 abbr,.jx2 abbr[title],.jx2 acronym,.jx2 dfn,.jx2 .faded{text-decoration:none!important;border-bottom:0!important;cursor:inherit}
.jx2 a:not(.jx2-btn){border-bottom:0!important}
.jx2 *{text-decoration-style:solid!important}
.jx2 select,.jx2 select option,.jx2 .select2-container,.jx2 .select2-selection__rendered,.select2-dropdown,.select2-results__option,.select2-search__field{font-family:'DM Sans',sans-serif!important;font-size:16px!important;color:var(--jx-text,#111827)!important}
.select2-container--default .select2-results__option--highlighted,.select2-container--default .select2-results__option--highlighted[aria-selected]{color:#fff!important}
.jx2 .jx2-f--threadentryfield > label,.jx2 .jx2-f > label:not([for]){display:block;font-weight:600;margin-bottom:6px}
/* dotted rules from theme.css made solid/flat */
.jx2 a:hover,.jx2 .link:hover{border-bottom:0!important}
.jx2 #reply h2,.jx2 #ticketInfo h1{border-bottom:1px solid var(--jx-line)!important}
.jx2 .thread-body .attachments{border-top:1px solid var(--jx-line)!important}
.jx2 #ticketThread::before{border-left:2px solid var(--jx-line)!important}
.jx2 .freetext-files{border:1px solid var(--jx-line)!important}
.jx2 #logo.jx2-logo{display:flex!important;align-items:center;gap:10px}
/* signed-in ticket view */
.jx2 #ticketInfo,.jx2 table.infoTable,.jx2 #ticketInfo table{width:100%!important;border:0!important;border-collapse:collapse!important;background:#fff!important}
.jx2 #ticketInfo > tbody > tr > td{vertical-align:top;padding:0 12px 0 0;border:0!important;width:50%}
.jx2 #ticketInfo table.infoTable{border:1px solid var(--jx-line)!important;border-radius:10px}
.jx2 table.infoTable th{background:var(--jx-tint)!important;text-align:left;padding:10px 12px!important;font-weight:600;border:0!important;border-bottom:1px solid var(--jx-line)!important}
.jx2 table.infoTable td{padding:8px 12px!important;border:0!important;border-bottom:1px solid var(--jx-line)!important;background:#fff!important}
.jx2 #ticketInfo h1{font-size:24px;margin:0 0 16px;padding-bottom:12px}
.jx2 .thread-entry .header{background:var(--jx-tint)!important;border:1px solid var(--jx-line)!important;border-bottom:0!important;border-radius:10px 10px 0 0}
.jx2 .thread-entry .thread-body,.jx2 .thread-entry{border-color:var(--jx-line)!important;box-shadow:none!important}
.jx2 .thread-entry .thread-body{border:1px solid var(--jx-line)!important;border-radius:0 0 10px 10px;background:#fff}
.jx2 .thread-entry.message .header,.jx2 .thread-entry.response .header{background:var(--jx-tint)!important}
.jx2 #reply{background:#fff!important;border:1px solid var(--jx-line)!important;border-radius:10px;padding:20px!important}
.jx2 #reply h2{font-size:18px;border-top:0!important;border-left:0!important;border-right:0!important}
.jx2 #reply input[type=submit],.jx2 #reply input[type=reset],.jx2 #reply input[type=button],.jx2 .action-button{font:inherit!important;font-weight:600!important;border-radius:8px!important;padding:10px 18px!important;border:1px solid var(--jx-brand)!important;background:#fff!important;color:var(--jx-brand)!important;box-shadow:none!important}
.jx2 #reply input[type=submit]{background:var(--jx-brand)!important;color:#fff!important}
.jx2 table.list,.jx2 #ticketTable{border-collapse:collapse!important;border:1px solid var(--jx-line)!important;width:100%}
.jx2 table.list th,.jx2 #ticketTable th{background:var(--jx-tint)!important;padding:10px!important;border:0!important;border-bottom:1px solid var(--jx-line)!important;text-align:left}
.jx2 table.list td,.jx2 #ticketTable td{padding:10px!important;border:0!important;border-bottom:1px solid var(--jx-line)!important;background:#fff!important}
@media(max-width:700px){.jx2 #ticketInfo > tbody > tr > td{display:block;width:100%;padding:0 0 12px}.jx2 #ticketInfo,.jx2 #ticketInfo>tbody,.jx2 #ticketInfo>tbody>tr{display:block}}
.jx2 #ticketInfo .action-button,.jx2 .action-button{font-size:13px!important;padding:6px 12px!important;line-height:1.3!important;height:auto!important}
/* v7: mobile ticket view padding, flat buttons everywhere */
@media(max-width:700px){.jx2 #ticketInfo,.jx2 #ticketThread,.jx2 #reply,.jx2 #content > h1,.jx2 #content > form,.jx2 #content > .thread-entry,.jx2 #content > hr{margin-left:16px!important;margin-right:16px!important;width:auto!important;box-sizing:border-box}
.jx2 #content{padding-left:0;padding-right:0}}
.jx2 input[type=submit],.jx2 input[type=reset],.jx2 input[type=button],.jx2 button:not(.re-button):not(.ui-datepicker-trigger){font:inherit!important;font-size:15px!important;font-weight:600!important;border-radius:8px!important;padding:10px 18px!important;border:1px solid var(--jx-brand)!important;background:#fff!important;color:var(--jx-brand)!important;box-shadow:none!important;background-image:none!important;cursor:pointer;height:auto!important;line-height:1.3!important}
.jx2 input[type=submit]{background:var(--jx-brand)!important;color:#fff!important}
