:root { --cgpa-calc-accent:#4361ee;--cgpa-calc-accent-deep:#3a56d4;--cgpa-calc-accent-light:#e6f0ff;--cgpa-calc-body-text:#2b2d42;--cgpa-calc-bg:#f8f9fa;--cgpa-calc-white:#ffffff;--cgpa-calc-border:#e0e3e7;--cgpa-calc-danger:#e74c3c;--cgpa-calc-danger-deep:#f02009;--cgpa-calc-success:#2ecc71;--cgpa-calc-success-deep:#27ae60;--cgpa-calc-radius:5px;--cgpa-calc-spacing:1.5rem;--cgpa-calc-gap:0.65rem;} .cgpa-calc-options-row { display:flex;flex-wrap:wrap;gap:var(--cgpa-calc-gap);padding:var(--cgpa-calc-spacing);border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);background-color:var(--cgpa-calc-bg);} .cgpa-calc-option { flex:1 1 200px;display:flex;flex-direction:column;} .cgpa-calc-label { font-size:0.9rem;margin-bottom:5px;color:var(--cgpa-calc-body-text);font-weight:600;} .cgpa-calc-custom-scale { background-color:var(--cgpa-calc-bg);border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);padding:var(--cgpa-calc-spacing);} .cgpa-calc-custom-scale-title { font-size:1.2rem;text-transform:capitalize;margin-bottom:var(--cgpa-calc-spacing);color:var(--cgpa-calc-body-text);font-weight:700;} .cgpa-calc-custom-grade-rows { display:grid;grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));gap:10px;} .cgpa-calc-custom-grade-row label { display:block;margin-bottom:5px;font-size:0.85rem;color:var(--cgpa-calc-body-text);} .cgpa-calc-semester { background-color:var(--cgpa-calc-bg);border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);padding:var(--cgpa-calc-spacing);position:relative;margin-top:var(--cgpa-calc-gap);} .cgpa-calc-semester:first-child{ margin-top:0 !important;} .cgpa-calc-semester-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--cgpa-calc-border);padding-bottom:10px;} .cgpa-calc-semester-title { color:var(--cgpa-calc-body-text);font-size:1.2rem;text-transform:capitalize;} .cgpa-calc-remove-semester-btn { background:none !important;padding:0 !important;border:none !important;color:var(--cgpa-calc-danger) !important;font-size:1.85rem;cursor:pointer;transition:color 0.2s ease-in-out;} .cgpa-calc-remove-semester-btn:hover { color:var(--cgpa-calc-danger-deep) !important;} .cgpa-calc-course-input-row { display:grid;grid-template-columns:5fr 2.5fr 2.5fr 1fr 1fr;gap:10px;align-items:center;margin-bottom:15px;} .cgpa-calc-course-input-row:last-of-type { margin-bottom:20px;} .cgpa-calc-grade-point { font-weight:bold;color:#666;text-align:center;padding:10px;} .cgpa-calc-remove-course-btn { background:none !important;padding:0 !important;border:none !important;color:#999 !important;font-size:1.4rem;cursor:pointer;padding:5px;transition:color 0.2s ease-in-out;justify-self:center;} .cgpa-calc-remove-course-btn:hover { color:var(--cgpa-calc-danger-deep) !important;} .cgpa-calc-add-course-row { display:flex;justify-content:space-between;align-items:center;gap:var(--cgpa-calc-gap);margin-top:20px;} .cgpa-calc-add-course-btn { background-color:var(--cgpa-calc-success) !important;color:var(--cgpa-calc-white) !important;border:none;border-radius:var(--cgpa-calc-radius);height:45px !important;padding:0 15px;cursor:pointer;font-size:0.85rem !important;transition:background-color 0.2s ease-in-out;width:fit-content;} .cgpa-calc-add-course-btn:hover { background-color:var(--cgpa-calc-success-deep) !important;} .cgpa-calc-semester-gpa-display { font-size:1rem;color:var(--cgpa-calc-body-text);font-weight:500;border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);padding:10px;} .cgpa-calc-add-semester-btn { background-color:var(--cgpa-calc-accent) !important;color:var(--cgpa-calc-white) !important;border:none;border-radius:var(--cgpa-calc-radius);height:45px !important;padding:0 15px;cursor:pointer;font-size:1rem;left:0;width:fit-content;} .cgpa-calc-result-section { background-color:var(--cgpa-calc-bg);border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);padding:var(--cgpa-calc-spacing);text-align:center;display:flex;flex-direction:column;gap:var(--cgpa-calc-spacing);margin-top:10px;} .cgpa-calc-main-cgpa-summary { display:flex;justify-content:center;align-items:center;gap:var(--cgpa-calc-gap);} .cgpa-calc-main-cgpa-summary p { width:100%;font-size:1.2rem;color:var(--cgpa-calc-body-text) !important;font-weight:500;border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);padding:var(--cgpa-calc-spacing);background-color:var(--cgpa-calc-accent-light);} .cgpa-calc-score { font-weight:700;color:var(--cgpa-calc-accent) !important;} .cgpa-calc-semester-summaries { text-align:center;display:flex;justify-content:center;align-items:center;gap:var(--cgpa-calc-gap);flex-wrap:wrap;} .cgpa-calc-semester-summaries p { font-size:1rem;color:var(--cgpa-calc-body-text);padding:var(--cgpa-calc-gap);border:1px solid var(--cgpa-calc-border);border-radius:var(--cgpa-calc-radius);width:max-content;background-color:var(--cgpa-calc-accent-light) !important;} .cgpa-calc-summary-table-container h2 { font-size:1.2rem;color:var(--cgpa-calc-body-text);margin-bottom:15px;text-align:left;} .cgpa-calc-summary-table { width:100%;border-collapse:collapse;margin-bottom:20px;overflow-x:auto;box-sizing:border-box;} .cgpa-calc-summary-table th, .cgpa-calc-summary-table td { border:1px solid var(--cgpa-calc-border) !important;padding:10px;text-align:left;} .cgpa-calc-summary-table th { background-color:#f8f8f8;font-weight:600;color:var(--cgpa-calc-body-text);} .cgpa-calc-summary-table tbody tr:nth-child(odd) { background-color:#fdfdfd;} .cgpa-calc-action-buttons { display:flex;justify-content:center;gap:var(--cgpa-calc-gap);} .cgpa-calc-hidden { display:none !important;} #cgpa-calc-pdf-export-content { padding:20px;font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;color:#333;line-height:1.6;background-color:#ffffff;display:none;width:210mm;margin:0 auto;} #cgpa-calc-pdf-export-content h1, #cgpa-calc-pdf-export-content h2 { text-align:center;margin-bottom:15px;color:#333;} #cgpa-calc-pdf-export-content .cgpa-calc-score-display { text-align:center;margin-bottom:20px;font-size:1.2em;} #cgpa-calc-pdf-export-content .cgpa-calc-score-display p { margin:5px 0;font-weight:bold;} #cgpa-calc-pdf-export-content .cgpa-calc-semester-summaries-pdf p { margin:3px 0;font-size:1em;} #cgpa-calc-pdf-export-content .cgpa-calc-summary-table-pdf { width:100%;border-collapse:collapse;margin-top:20px;} #cgpa-calc-pdf-export-content .cgpa-calc-summary-table-pdf th, #cgpa-calc-pdf-export-content .cgpa-calc-summary-table-pdf td { border:1px solid #ccc;padding:8px;text-align:left;font-size:0.9em;} #cgpa-calc-pdf-export-content .cgpa-calc-summary-table-pdf th { background-color:#f0f0f0;} .cgpa-calc-summary-table-container { overflow-x:auto;-webkit-overflow-scrolling:touch;} .cgpa-calc-summary-table { min-width:600px;width:100%;} @media print { body * { visibility:hidden;} .print-container, .print-container * { visibility:visible;} .print-container { position:absolute;left:0;top:0;width:100%;padding:20px;} .no-print { display:none !important;} table { page-break-inside:avoid;} } @media (max-width:768px) { .cgpa-calc-container { padding:15px;} .cgpa-calc-wrapper { padding:15px;} .cgpa-calc-semester { padding:12px;} .cgpa-calc-course-input-row { display:flex;flex-direction:column;gap:12px;margin-bottom:20px;padding:12px;background-color:rgba(255, 255, 255, 0.8);border-radius:var(--cgpa-calc-radius);box-shadow:0 2px 4px rgba(0, 0, 0, 0.05);} .cgpa-calc-course-name-col, .cgpa-calc-grade-col, .cgpa-calc-credit-col, .cgpa-calc-grade-point-col, .cgpa-calc-remove-col { width:100%;display:flex;align-items:center;} .cgpa-calc-grade-col label, .cgpa-calc-credit-col label { font-size:0.9rem;color:var(--cgpa-calc-body-text);font-weight:500;} .cgpa-calc-remove-col { justify-content:flex-end;margin-top:-8px;margin-bottom:-4px;} .cgpa-calc-grade-point-col { order:1;font-size:0.95rem;color:var(--cgpa-calc-accent-deep);font-weight:600;padding:8px 0;border-top:1px dashed var(--cgpa-calc-border);} .cgpa-calc-add-course-row { flex-direction:column;align-items:stretch;gap:15px;} .cgpa-calc-semester-gpa-display { width:100%;margin-top:10px;padding:12px;font-size:0.95rem;} .cgpa-calc-add-course-btn, .cgpa-calc-add-semester-btn { height:46px !important;font-size:0.95rem;} .cgpa-calc-summary-table { min-width:100%;} .cgpa-calc-summary-table th, .cgpa-calc-summary-table td { padding:8px 5px;font-size:0.9em;} } @media (max-width:500px) { .cgpa-calc-main-cgpa-summary { flex-direction:column;width:100%;} .cgpa-calc-main-cgpa-summary p { width:100%;} } @media (max-width:480px) { .cgpa-calc-container { padding:10px;} .cgpa-calc-wrapper { padding:10px;} .cgpa-calc-semester { padding:10px;} .cgpa-calc-course-input-row { padding:10px;gap:10px;} .cgpa-calc-grade-col, .cgpa-calc-credit-col { grid-template-columns:100px 1fr;} .cgpa-calc-grade-col label, .cgpa-calc-credit-col label { font-size:0.85rem;} .cgpa-calc-grade-point-col { font-size:0.9rem;} .cgpa-calc-semester-gpa-display { font-size:0.9rem;padding:10px;} .cgpa-calc-action-buttons { flex-direction:column;} }