/* Uses the existing Athar colors, navigation and glass-form styling. */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #0b0813;
    color: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-image: radial-gradient(circle at 10% 20%, rgba(91, 33, 182, .18) 0%, transparent 40%),
                      radial-gradient(circle at 90% 80%, rgba(29, 78, 216, .18) 0%, transparent 40%);
}
button, input, textarea, select { font: inherit; }
[hidden] { display: none !important; }
a { color: #93c5fd; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid #93c5fd; outline-offset: 4px; }
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 8%;
    background: rgba(15, 12, 28, .75);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(168, 85, 247, .25);
    position: sticky;
    top: 0;
    z-index: 1000;
}
.logo-container, .nav-wrapper { display: flex; align-items: center; }
.logo-img { height: 55px; width: auto; filter: drop-shadow(0 0 8px rgba(168, 85, 247, .5)); }
.nav-links { list-style: none; display: flex; gap: 35px; }
.nav-links a { color: #cbd5e1; text-decoration: none; font-weight: 500; font-size: 14px; letter-spacing: .5px; }
.nav-links a:hover { color: #a855f7; text-shadow: 0 0 8px rgba(168, 85, 247, .6); }
.menu-toggle { display: none; flex-direction: column; gap: 6px; cursor: pointer; border: none; background: transparent; padding: 10px; z-index: 1010; }
.menu-toggle span { display: block; width: 26px; height: 2.5px; background-color: #fff; border-radius: 2px; transition: transform .3s ease; }
.submission-container { max-width: 880px; width: 100%; margin: 40px auto 70px; padding: 0 24px; flex: 1; }
.back-link { display: inline-block; margin-bottom: 28px; font-size: 14px; text-decoration: none; }
.back-link:hover { text-decoration: underline; }
.submission-heading { text-align: center; margin-bottom: 32px; }
.section-subtitle { color: #3b82f6; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 8px; text-shadow: 0 0 8px rgba(59, 130, 246, .4); }
.submission-heading h1 { font-size: 40px; font-weight: 800; letter-spacing: 1px; margin-bottom: 12px; }
.submission-heading > p:last-child { color: #cbd5e1; line-height: 1.6; }
.submission-card { background: rgba(20, 16, 38, .6); border: 1px solid rgba(168, 85, 247, .4); box-shadow: 0 0 30px rgba(168, 85, 247, .15); border-radius: 20px; padding: 36px 40px; }
fieldset { min-width: 0; border: 0; margin: 0 0 28px; padding: 0 0 6px; border-bottom: 1px solid rgba(255, 255, 255, .09); }
legend { font-size: 20px; font-weight: 700; padding: 0; margin-bottom: 20px; }
.field-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.item-options { grid-template-columns: minmax(0, 3fr) minmax(100px, 1fr); }
.form-group { margin-bottom: 22px; min-width: 0; }
label { display: block; font-size: 14px; font-weight: 600; color: #d8b4fe; margin-bottom: 8px; }
.optional { color: #94a3b8; font-weight: 400; }
input, textarea, select { width: 100%; min-width: 0; background: rgba(11, 8, 19, .7); border: 1px solid rgba(255, 255, 255, .18); border-radius: 8px; padding: 13px 14px; color: #fff; font-size: 16px; scroll-margin-top: 108px; }
select { background-color: #141026; }
input::placeholder, textarea::placeholder { color: #8491a6; opacity: 1; }
input:focus, textarea:focus, select:focus { border-color: #3b82f6; box-shadow: 0 0 10px rgba(59, 130, 246, .3); }
textarea { resize: vertical; line-height: 1.5; }
.field-help { color: #a7b2c5; font-size: 13px; line-height: 1.6; margin-top: 8px; }
.field-help:empty { display: none; }
.fieldset-help { color: #cbd5e1; font-size: 14px; line-height: 1.6; margin: -8px 0 20px; }
.upload-group { border: 1px dashed rgba(168, 85, 247, .5); background: rgba(168, 85, 247, .04); border-radius: 12px; padding: 20px; }
input[type="file"] { padding: 8px; font-size: 13px; }
input[type="file"]::file-selector-button { color: #fff; background: #533195; border: 0; border-radius: 5px; padding: 10px 12px; margin-right: 10px; cursor: pointer; }
.image-previews { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; margin-top: 14px; }
.image-previews:empty { display: none; }
.image-preview { min-width: 0; background: #100d1c; border: 1px solid rgba(255, 255, 255, .13); border-radius: 9px; padding: 8px; }
.image-preview img { width: 100%; height: 115px; object-fit: contain; display: block; background: #eeeaf3; border-radius: 5px; }
.image-name { font-size: 12px; color: #cbd5e1; overflow-wrap: anywhere; margin: 8px 0; line-height: 1.5; }
.image-actions { display: flex; gap: 8px; justify-content: space-between; flex-wrap: wrap; }
.image-actions a, .image-actions button { background: transparent; border: 0; color: #c4b5fd; cursor: pointer; font-size: 12px; padding: 8px 0; text-decoration: underline; }
.image-actions button { color: #fda4af; }
.submission-note { padding: 18px 20px; border: 1px solid rgba(59, 130, 246, .25); border-radius: 10px; margin-bottom: 22px; background: rgba(59, 130, 246, .05); }
.submission-note strong { font-size: 15px; }
.submission-note p { margin-top: 8px; color: #cbd5e1; font-size: 14px; line-height: 1.7; }
.submit-btn { width: 100%; background: linear-gradient(135deg, #a855f7, #3b82f6); color: #fff; border: 0; padding: 16px; border-radius: 8px; font-size: 15px; font-weight: 700; cursor: pointer; box-shadow: 0 4px 15px rgba(168, 85, 247, .3); }
.submit-btn:hover { box-shadow: 0 0 25px rgba(168, 85, 247, .5); }
.submit-btn:disabled { opacity: .55; cursor: wait; }
.error-message { color: #fda4af; font-size: 14px; line-height: 1.6; margin: 12px 0; }
.message-panel { margin-top: 28px; padding-top: 28px; border-top: 1px solid rgba(168, 85, 247, .4); scroll-margin-top: 110px; }
.message-panel h2 { font-size: 21px; margin-bottom: 12px; }
.message-panel > p { line-height: 1.7; color: #cbd5e1; font-size: 14px; }
.message-panel label { margin-top: 20px; }
.secondary-btn { display: inline-block; color: #fff; border: 1px solid rgba(168, 85, 247, .55); border-radius: 8px; padding: 12px 16px; margin-top: 12px; background: rgba(168, 85, 247, .1); text-decoration: none; cursor: pointer; font-size: 14px; }
footer { border-top: 1px solid rgba(168, 85, 247, .2); background: #06040a; padding: 40px 8%; text-align: center; display: flex; flex-direction: column; gap: 15px; align-items: center; margin-top: auto; }
.footer-text-small { font-size: 12px; color: #64748b; letter-spacing: .5px; line-height: 1.5; }
.neon-link { color: #3b82f6; text-decoration: none; }
.neon-link:hover { color: #a855f7; }
@media (max-width: 992px) { header { padding: 15px 5%; } }
@media (max-width: 768px) {
    .menu-toggle { display: flex; }
    .nav-links { position: absolute; top: 85px; right: 0; width: 260px; max-width: 100vw; background: rgba(15, 12, 28, .98); border: 1px solid rgba(168, 85, 247, .25); border-bottom-left-radius: 16px; flex-direction: column; padding: 30px; gap: 25px; align-items: flex-start; visibility: hidden; }
    .nav-links.active { visibility: visible; }
    .menu-toggle.active span:nth-child(1) { transform: translateY(8.5px) rotate(45deg); }
    .menu-toggle.active span:nth-child(2) { opacity: 0; }
    .menu-toggle.active span:nth-child(3) { transform: translateY(-8.5px) rotate(-45deg); }
    .submission-container { margin-top: 24px; padding: 0 18px; }
    .submission-card { padding: 28px 22px; }
    .submission-heading h1 { font-size: 32px; }
}
@media (max-width: 540px) {
    .field-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .submission-card { padding: 24px 18px; }
    .upload-group { padding: 12px; }
    .image-previews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .image-preview img { height: 95px; }
    .submission-note { padding: 16px; }
}
