:root{
        --crp-green:#006b5b;
        --bg:#f6f8fa;
        --text:#333;
        --border:#ddd;
      }
      body{font-family: "Segoe UI", Arial, sans-serif; background:var(--bg); margin:0;}
      form{max-width:1100px;margin:28px auto;background:#fff;padding:28px;border-radius:10px;box-shadow:0 4px 18px rgba(0,0,0,.06);}
      h1{color:var(--crp-green);text-align:left;margin:0 0 18px 0;}
      h2{color:var(--crp-green);margin-top:28px;}
      label{display:block;font-weight:600;margin:8px 0 6px;color:var(--text);}
      .form-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
      .grid-3{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
      input[type="text"], input[type="number"], textarea, select, .asp-control {
        width:100%;padding:10px;border:1px solid var(--border);border-radius:6px;box-sizing:border-box;font-size:14px;
      }
      textarea{min-height:80px;resize:vertical;}
      .radio-group{display:flex;gap:12px;align-items:center;margin:6px 0;}
      .info-box{background:#eaf6f2;border-left:4px solid:var(--crp-green);padding:10px;border-radius:6px;color:var(--text);margin:12px 0;}
      .submit-btn{width:100%;padding:12px;border-radius:6px;border:none;background:var(--crp-green);color:#fff;font-size:16px;margin-top:22px;cursor:pointer;}
      @media(max-width:600px){ form{padding:18px;} }
      
      .table-container {
    width: 100%;
    overflow-x: auto;
    margin-top: 20px;
}

.styled-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    border-radius: 8px;
    overflow: hidden;
}

.styled-table th,
.styled-table td {
    padding: 12px 15px;
    text-align: left;
}

.styled-table th {
    background-color: var(--crp-green, #007b5e);
    color: #fff;
    font-weight: 600;
}

.styled-table tr:nth-child(even) {
    background-color: #f5f5f5;
}

.styled-table tr:hover {
    background-color: #e9f5f1;
    transition: 0.2s;
}

@media (max-width: 768px) {
    .styled-table thead {
        display: none;
    }

    .styled-table tr {
        display: block;
        margin-bottom: 15px;
        border: 1px solid #ddd;
        border-radius: 6px;
    }

    .styled-table td {
        display: flex;
        justify-content: space-between;
        padding: 10px;
        font-size: 14px;
    }

    .styled-table td::before {
        content: attr(data-label);
        font-weight: bold;
        color: #333;
    }
}