@import url("components/upload/upload.css");
@import url("components/summary/summary.css");
@import url("components/trade-tables/trade-tables.css");
@import url("components/sip-results/sip-results.css");
@import url("components/sip-return-slider/sip-return-slider.css");
@import url("components/sip-inputs/sip-inputs.css");

*{box-sizing:border-box}
html{min-height:100%;background:url("assets/background.jpg") center/cover fixed no-repeat}
body{min-height:100vh;font-family:Arial,sans-serif;margin:40px;background:transparent;color:#242424;overflow-x:hidden}
.container{width:100%;max-width:1180px;margin:0 auto;padding:28px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.45);border-radius:8px;box-shadow:0 14px 34px rgba(0,0,0,.32);backdrop-filter:blur(3px);overflow:hidden}
h1,h2,p{overflow-wrap:anywhere}

@media (max-width:760px){
 body{margin:16px}
 .container{padding:18px}
}

@media (max-width:420px){
 body{margin:10px}
 .container{padding:14px;border-radius:6px}
}

/* Home Portal & Navigation */
.home-header{margin-bottom:28px}
.home-header h1{margin:0 0 10px 0;font-size:34px;color:#1e293b;font-weight:800}
.home-header p{margin:0;color:#475569;font-size:16px;line-height:1.5;max-width:680px}

.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:24px}
.tool-card{display:flex;flex-direction:column;justify-content:space-between;padding:28px;background:rgba(255,255,255,.9);border:1px solid rgba(226,232,240,.9);border-radius:12px;text-decoration:none;color:#1e293b;box-shadow:0 6px 20px rgba(0,0,0,.08);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.tool-card:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(29,79,122,.18);border-color:#2f80b9}
.tool-card-badge{display:inline-block;align-self:flex-start;padding:5px 12px;background:#e0f2fe;color:#0369a1;font-size:12px;font-weight:700;border-radius:20px;letter-spacing:.5px;text-transform:uppercase;margin-bottom:16px}
.tool-card h2{margin:0 0 12px 0;font-size:24px;color:#0f172a}
.tool-card p{margin:0 0 24px 0;color:#475569;font-size:15px;line-height:1.6}
.tool-card-action{display:flex;align-items:center;gap:8px;color:#1d4f7a;font-weight:700;font-size:15px;transition:gap .2s ease,color .2s ease}
.tool-card:hover .tool-card-action{gap:14px;color:#0284c7}

.top-nav-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px;width:100%}
.back-link{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:#475569;font-size:14px;font-weight:600;margin-bottom:0;transition:color .2s ease,transform .2s ease}
.back-link:hover{color:#1d4f7a;transform:translateX(-4px)}
.suggestion-nav-link{color:#0369a1;margin-left:auto}
.suggestion-nav-link:hover{color:#0284c7;transform:translateX(4px)}

/* Suggestion Box UI */
.suggestion-container{max-width:840px;margin:40px auto;text-align:center}
.suggestion-header{margin-bottom:28px}
.suggestion-header h1{margin:0 0 10px 0;font-size:34px;color:#1e293b;font-weight:800}
.suggestion-header p{margin:0 auto;color:#475569;font-size:16px;line-height:1.6;max-width:680px}

.feedback-banner{padding:14px 18px;border-radius:8px;margin-bottom:20px;font-weight:600;font-size:15px;line-height:1.4;text-align:left}
.banner-success{background:#dcfce7;color:#166534;border:1px solid #86efac}
.banner-error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}

.suggestion-form{display:flex;flex-direction:column;gap:20px;background:rgba(255,255,255,.8);padding:32px;border-radius:12px;border:1px solid rgba(226,232,240,.9);text-align:left;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.form-group{display:flex;flex-direction:column;gap:8px}
.form-group label{font-size:14px;font-weight:700;color:#334155}
.form-group .required{color:#dc2626}
.form-group .optional{color:#94a3b8;font-weight:500;font-size:13px}
.field-hint{color:#64748b;font-size:12px;line-height:1.4}

.suggestion-form input[type="text"],
.suggestion-form input[type="email"],
.suggestion-form select,
.suggestion-form textarea{width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:8px;font-size:15px;font-family:inherit;color:#1e293b;background:#ffffff;transition:border-color .2s ease,box-shadow .2s ease}
.suggestion-form input:focus,
.suggestion-form select:focus,
.suggestion-form textarea:focus{outline:none;border-color:#2f80b9;box-shadow:0 0 0 3px rgba(47,128,185,.15)}

.submit-btn{align-self:center;min-width:260px;text-align:center;padding:14px 28px;background:linear-gradient(135deg,#1d4f7a,#2f80b9);color:#ffffff;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(29,79,122,.25);transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}
.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px rgba(29,79,122,.35)}
.submit-btn:disabled{opacity:.7;cursor:not-allowed}

.suggestion-home-card{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(254,243,199,.35));border-color:#fde68a}
