/* Submit ticket — submitticket.php */
.fh-ticket {
    --ticket-cyan: #67d4ff;
    --ticket-blue: #347fff;
    --ticket-panel: #091831;
    --ticket-deep: #050e20;
    --ticket-line: rgba(112, 177, 255, .17);
    --ticket-muted: #8499b8;
    color: var(--ticket-muted);
    padding: 12px 0 38px;
}
.fh-ticket-hero { align-items: end; background: radial-gradient(circle at 88% 0, rgba(52,127,255,.24), transparent 26rem), linear-gradient(145deg,#0d244b,#061126 72%); border: 1px solid var(--ticket-line); border-radius: 28px; box-shadow: 0 30px 90px rgba(0,0,0,.3); display: grid; gap: 28px; grid-template-columns: minmax(0,1fr) auto; min-height: 245px; overflow: hidden; padding: 42px; position: relative; }
.fh-ticket-hero:after { border: 1px solid rgba(103,212,255,.13); border-radius: 50%; content: ''; height: 340px; pointer-events: none; position: absolute; right: -150px; top: -220px; width: 340px; }
.fh-ticket-hero > * { position: relative; z-index: 1; }
.fh-ticket-kicker { color: var(--ticket-cyan); display: block; font-size: .63rem; font-weight: 800; letter-spacing: .17em; margin-bottom: 14px; }
.fh-ticket-hero h2,
.fh-ticket-confirm-card h2 { color: #f5f9ff !important; font-family: 'Space Grotesk',sans-serif; font-size: clamp(2.55rem,5vw,4.4rem); letter-spacing: -.06em; line-height: .97; margin: 0; }
.fh-ticket-hero h2 em,
.fh-ticket-confirm-card h2 em { color: var(--ticket-cyan); font-style: normal; }
.fh-ticket-hero p { color: #94a9c7; line-height: 1.7; margin: 17px 0 0; max-width: 680px; }
.fh-ticket-back { align-items: center; background: rgba(4,13,29,.62); border: 1px solid rgba(112,177,255,.19); border-radius: 10px; color: #c8daef !important; display: inline-flex; font-size: .66rem; font-weight: 800; gap: 8px; padding: 10px 12px; text-decoration: none !important; }
.fh-ticket-back:hover { border-color: rgba(103,212,255,.42); color: #fff !important; }
.fh-ticket-progress { align-items: center; background: linear-gradient(150deg,#0a1b37,#061126); border: 1px solid var(--ticket-line); border-radius: 15px; display: flex; justify-content: center; margin: 14px 0 30px; padding: 13px 18px; }
.fh-ticket-progress span { align-items: center; color: #61799a; display: flex; font-size: .59rem; font-weight: 800; gap: 8px; white-space: nowrap; }
.fh-ticket-progress span i { align-items: center; background: rgba(112,177,255,.07); border: 1px solid rgba(112,177,255,.14); border-radius: 50%; display: flex; font-size: .56rem; font-style: normal; height: 25px; justify-content: center; width: 25px; }
.fh-ticket-progress span.active { color: #eaf5ff; }
.fh-ticket-progress span.active i { background: rgba(52,127,255,.18); border-color: rgba(103,212,255,.35); color: var(--ticket-cyan); }
.fh-ticket-progress span.complete { color: #9bcbe4; }
.fh-ticket-progress span.complete i { background: rgba(103,212,255,.12); color: var(--ticket-cyan); }
.fh-ticket-progress b { background: rgba(112,177,255,.15); height: 1px; margin: 0 16px; max-width: 105px; width: 8vw; }
.fh-ticket-section-head { align-items: end; display: flex; justify-content: space-between; margin: 0 2px 14px; }
.fh-ticket-section-head > div > span { color: var(--ticket-cyan); display: block; font-size: .56rem; font-weight: 800; letter-spacing: .15em; margin-bottom: 6px; }
.fh-ticket-section-head h3 { color: #eff7ff !important; font-family: 'Space Grotesk',sans-serif; font-size: 1.45rem; letter-spacing: -.035em; margin: 0; }
.fh-ticket-section-head > small { color: #617a9d; font-size: .65rem; }
.fh-ticket-department-grid { display: grid; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.fh-ticket-department { align-items: center; background: radial-gradient(circle at 100% 0,rgba(52,127,255,.1),transparent 12rem),linear-gradient(150deg,#0a1b37,#061126); border: 1px solid var(--ticket-line); border-radius: 18px; display: grid; gap: 15px; grid-template-columns: auto 46px minmax(0,1fr) auto; min-height: 126px; padding: 22px; position: relative; text-decoration: none !important; transition: border-color .2s ease,transform .2s ease; }
.fh-ticket-department:hover { border-color: rgba(103,212,255,.42); transform: translateY(-4px); }
.fh-ticket-department-number { color: #415c81; font-family: 'Space Grotesk',sans-serif; font-size: .65rem; font-weight: 800; }
.fh-ticket-department-icon { align-items: center; background: rgba(52,127,255,.13); border: 1px solid rgba(103,212,255,.16); border-radius: 13px; color: var(--ticket-cyan); display: flex; height: 46px; justify-content: center; width: 46px; }
.fh-ticket-department-copy { min-width: 0; }
.fh-ticket-department-copy strong { color: #edf7ff; display: block; font-family: 'Space Grotesk',sans-serif; font-size: 1rem; letter-spacing: -.02em; }
.fh-ticket-department-copy small { color: #7189aa; display: block; line-height: 1.5; margin-top: 6px; }
.fh-ticket-department-arrow { color: var(--ticket-cyan); font-size: .7rem; transition: transform .2s ease; }
.fh-ticket-department:hover .fh-ticket-department-arrow { transform: translateX(4px); }
.fh-ticket-response-note { align-items: center; background: rgba(4,13,29,.48); border: 1px solid rgba(112,177,255,.1); border-radius: 14px; display: flex; gap: 12px; margin-top: 13px; padding: 15px 18px; }
.fh-ticket-response-note > i { color: var(--ticket-cyan); }
.fh-ticket-response-note strong,
.fh-ticket-response-note span { display: block; }
.fh-ticket-response-note strong { color: #c9d9eb; font-size: .68rem; }
.fh-ticket-response-note span { color: #61799a; font-size: .6rem; margin-top: 2px; }
.fh-ticket-form-layout { align-items: start; display: grid; gap: 14px; grid-template-columns: minmax(0,1fr) 270px; }
.fh-ticket-form-card { background: linear-gradient(150deg,#0a1b37,#061126) !important; border: 1px solid var(--ticket-line) !important; border-radius: 20px; box-shadow: 0 22px 65px rgba(0,0,0,.22); overflow: hidden; }
.fh-ticket-form-card > .card-body { padding: 28px; }
.fh-ticket-form-heading { align-items: center; border-bottom: 1px solid rgba(112,177,255,.11); display: flex; gap: 12px; margin: 6px 0 19px; padding-bottom: 13px; }
.fh-ticket-form-heading:not(:first-child) { margin-top: 27px; }
.fh-ticket-form-heading > span { align-items: center; background: rgba(52,127,255,.13); border: 1px solid rgba(103,212,255,.18); border-radius: 10px; color: var(--ticket-cyan); display: flex; font-family: 'Space Grotesk',sans-serif; font-size: .65rem; font-weight: 800; height: 36px; justify-content: center; width: 36px; }
.fh-ticket-form-heading small { color: #587194; display: block; font-size: .49rem; font-weight: 800; letter-spacing: .13em; }
.fh-ticket-form-heading h3 { color: #eaf5ff !important; font-family: 'Space Grotesk',sans-serif; font-size: .95rem; letter-spacing: -.02em; margin: 2px 0 0; }
.fh-ticket-form-card label { color: #93a8c4; font-size: .62rem; font-weight: 800; }
.fh-ticket-form-card .form-control,
.fh-ticket-form-card .custom-file-label { background: #050e20 !important; border: 1px solid rgba(112,177,255,.18) !important; border-radius: 9px; color: #e7f3ff !important; }
.fh-ticket-form-card .form-control { min-height: 44px; }
.fh-ticket-form-card textarea.form-control { min-height: 220px; padding: 14px; }
.fh-ticket-form-card .form-control:focus { border-color: rgba(103,212,255,.45) !important; box-shadow: 0 0 0 3px rgba(52,127,255,.1); }
.fh-ticket-form-card .form-control:disabled { color: #6f84a2 !important; opacity: .72; }
.fh-ticket-form-card .custom-file-label:after { background: rgba(52,127,255,.13); border-left-color: rgba(112,177,255,.16); color: #b7cee7; }
.fh-ticket-form-card .text-muted { color: #5f7798 !important; }
.fh-ticket-form-card .tt-submit-btns { align-items: center; border-top: 1px solid rgba(112,177,255,.11); display: flex; margin-top: 25px; padding-top: 20px; }
.fh-ticket-form-card .btn { align-items: center; border-radius: 10px; display: inline-flex; font-size: .67rem; font-weight: 800; gap: 8px; justify-content: center; min-height: 43px; padding: 0 15px; }
.fh-ticket-form-card .btn-primary { background: linear-gradient(135deg,#3f8cff,#1d61dc) !important; border: 1px solid rgba(130,201,255,.4) !important; color: #fff !important; }
.fh-ticket-form-card .btn-default { background: rgba(52,127,255,.1) !important; border: 1px solid rgba(103,212,255,.18) !important; color: #dcecff !important; }
.fh-ticket-aside { display: grid; gap: 12px; position: sticky; top: 105px; }
.fh-ticket-aside-card { background: linear-gradient(150deg,#0a1b37,#061126); border: 1px solid var(--ticket-line); border-radius: 17px; padding: 21px; }
.fh-ticket-aside-icon { align-items: center; background: rgba(52,127,255,.13); border: 1px solid rgba(103,212,255,.16); border-radius: 11px; color: var(--ticket-cyan); display: flex; height: 42px; justify-content: center; margin-bottom: 17px; width: 42px; }
.fh-ticket-aside-card > small { color: var(--ticket-cyan); font-size: .49rem; font-weight: 800; letter-spacing: .13em; }
.fh-ticket-aside-card h3 { color: #eaf5ff !important; font-family: 'Space Grotesk',sans-serif; font-size: 1rem; line-height: 1.25; margin: 7px 0 16px; }
.fh-ticket-aside-card ul { list-style: none; margin: 0; padding: 0; }
.fh-ticket-aside-card li { border-top: 1px solid rgba(112,177,255,.09); color: #748aaa; font-size: .62rem; line-height: 1.45; padding: 10px 0; }
.fh-ticket-aside-card li i { color: var(--ticket-cyan); margin-right: 7px; }
.fh-ticket-aside-security { align-items: center; display: flex; gap: 11px; }
.fh-ticket-aside-security > i { color: var(--ticket-cyan); }
.fh-ticket-aside-security strong,
.fh-ticket-aside-security span { display: block; }
.fh-ticket-aside-security strong { color: #d4e3f3; font-size: .66rem; }
.fh-ticket-aside-security span { color: #667e9f; font-size: .57rem; line-height: 1.4; margin-top: 3px; }
.fh-ticket-suggestions { background: #07152d; border: 1px solid var(--ticket-line); border-radius: 14px; color: #7f95b3; margin: 13px 0; padding: 18px; }
.fh-ticket-suggestions h3 { color: #edf7ff !important; font-size: 1rem; }
.fh-ticket-suggestions .list-group-item { background: rgba(52,127,255,.05); border-color: rgba(112,177,255,.1); }
.fh-ticket-suggestions a { color: #b9ddfa; }
.fh-ticket-confirm-card { background: radial-gradient(circle at 50% 0,rgba(52,127,255,.2),transparent 28rem),linear-gradient(145deg,#0d244b,#061126 72%); border: 1px solid var(--ticket-line); border-radius: 28px; box-shadow: 0 30px 90px rgba(0,0,0,.3); margin: 12px auto 0; max-width: 850px; padding: 70px 45px; text-align: center; }
.fh-ticket-confirm-signal { align-items: center; background: rgba(52,127,255,.17); border: 1px solid rgba(103,212,255,.3); border-radius: 50%; box-shadow: 0 0 45px rgba(52,127,255,.22); color: var(--ticket-cyan); display: flex; font-size: 1.35rem; height: 72px; justify-content: center; margin: 0 auto 25px; width: 72px; }
.fh-ticket-confirm-card p { color: #8ea4c2; line-height: 1.7; margin: 20px auto 0; max-width: 600px; }
.fh-ticket-confirm-card p a { color: var(--ticket-cyan); font-weight: 800; }
.fh-ticket-confirm-actions { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; margin-top: 27px; }
.fh-ticket-confirm-actions .btn { align-items: center; border-radius: 10px; display: inline-flex; font-size: .68rem; font-weight: 800; gap: 9px; min-height: 44px; padding: 0 16px; }
.fh-ticket-confirm-actions .btn-primary { background: linear-gradient(135deg,#3f8cff,#1d61dc); border-color: rgba(130,201,255,.42); }
.fh-ticket-confirm-actions .btn-default { background: rgba(4,13,29,.55); border-color: rgba(112,177,255,.18); color: #d6e8f8; }
@media (max-width: 991.98px) {
    .fh-ticket-form-layout { grid-template-columns: 1fr; }
    .fh-ticket-aside { grid-template-columns: repeat(2,minmax(0,1fr)); position: static; }
}
@media (max-width: 767.98px) {
    .fh-ticket-hero { align-items: start; grid-template-columns: 1fr; min-height: 0; padding: 31px 24px; }
    .fh-ticket-hero .fh-ticket-back { width: fit-content; }
    .fh-ticket-progress { justify-content: flex-start; overflow-x: auto; }
    .fh-ticket-progress b { min-width: 28px; }
    .fh-ticket-section-head { align-items: start; flex-direction: column; gap: 5px; }
    .fh-ticket-department-grid { grid-template-columns: 1fr; }
    .fh-ticket-department { grid-template-columns: auto 42px minmax(0,1fr) auto; padding: 18px; }
    .fh-ticket-form-card > .card-body { padding: 21px; }
    .fh-ticket-aside { grid-template-columns: 1fr; }
    .fh-ticket-confirm-card { padding: 50px 23px; }
}
