/* === Disc Permeameter Calculator v1.0.0 === */
/* Colour scheme matched to LandWISE Centre Pivot Calculator */
/* Container */
.disc-permeameter-calculator {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0;
 background: #fff;
 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
 color: #333;
 line-height: 1.6;
}
/* Header */
.calculator-header {
 background: linear-gradient(135deg, #2c5530, #4a7c59);
 color: white;
 padding: 30px;
 border-radius: 10px;
 margin-bottom: 30px;
 text-align: center;
}
.calculator-header h2 {
 font-size: 2.2em;
 margin: 0 0 4px;
 color: white;
}
.version-label {
 font-size: 12px;
 color: rgba(255,255,255,0.7);
 margin-bottom: 14px;
}
/* Defaults banner */
.defaults-note {
 background: rgba(255,255,255,0.12);
 border: 1px solid rgba(255,255,255,0.25);
 padding: 14px 16px;
 border-radius: 8px;
 margin-top: 14px;
 text-align: left;
}
.defaults-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
 gap: 10px;
 align-items: end;
}
.default-item label {
 display: block;
 font-size: 12px;
 font-weight: 600;
 color: rgba(255,255,255,0.85);
 margin-bottom: 3px;
}
.default-item input {
 padding: 8px 10px;
 border: 2px solid rgba(255,255,255,0.3);
 border-radius: 6px;
 width: 100%;
 font-size: 14px;
 box-sizing: border-box;
 background: rgba(255,255,255,0.95);
 color: #333;
 transition: border-color 0.3s;
}
.default-item input:focus {
 outline: none;
 border-color: #fff;
 box-shadow: 0 0 0 2px rgba(255,255,255,0.3);
}
.defaults-toggle { margin-top: 10px; }
.advanced-panel {
 margin-top: 10px;
 padding-top: 10px;
 border-top: 1px dashed rgba(255,255,255,0.3);
}
/* Tabs */
.calculator-tabs {
 display: flex;
 background: #f8f9fa;
 border-bottom: 1px solid #ddd;
 overflow-x: auto;
 flex-wrap: wrap;
 border-radius: 10px 10px 0 0;
 box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.tab-button {
 flex: 1;
 min-width: 120px;
 padding: 15px 12px;
 background: transparent;
 border: none;
 cursor: pointer;
 font-size: 14px;
 font-weight: bold;
 color: #666;
 transition: all 0.3s ease;
 border-bottom: 3px solid transparent;
}
.tab-button:hover {
 background: #e9ecef;
 color: #2c5530;
}
.tab-button.active {
 background: white;
 color: #4a7c59;
 border-bottom-color: #4a7c59;
}
.tab-content { display: none; }
.tab-content.active { display: block; }
/* Sections */
.calculator-section {
 background: white;
 border-radius: 10px;
 padding: 25px;
 margin-bottom: 25px;
 box-shadow: 0 4px 6px rgba(0,0,0,0.1);
 border: 1px solid #e0e0e0;
}
.calculator-section h3 {
 color: #2c5530;
 font-size: 1.4em;
 margin-top: 0;
 margin-bottom: 20px;
 padding-bottom: 10px;
 border-bottom: 2px solid #e0e0e0;
}
.section-intro { color: #666; font-size: 14px; margin: 0 0 16px; font-style: italic; }
/* Input grids */
.input-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 gap: 20px;
 margin-bottom: 20px;
}
.input-grid.compact {
 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
 gap: 14px;
}
.input-group { display: flex; flex-direction: column; }
.input-group label { font-weight: 600; margin-bottom: 8px; color: #444; font-size: 14px; }
.input-group input[type="number"],
.input-group input[type="text"],
.input-group input[type="file"] {
 padding: 12px;
 border: 2px solid #ddd;
 border-radius: 6px;
 width: 100%;
 font-size: 16px;
 box-sizing: border-box;
 background: white;
 transition: border-color 0.3s;
}
.input-group input:focus {
 outline: none;
 border-color: #4a7c59;
 box-shadow: 0 0 0 2px rgba(74, 124, 89, 0.2);
}
.input-hint { font-size: 0.9em; color: #666; margin-top: 5px; font-style: italic; }
/* Buttons */
.btn-primary {
 background: linear-gradient(135deg, #4a7c59, #2c5530);
 color: #fff;
 border: none;
 padding: 12px 24px;
 border-radius: 6px;
 cursor: pointer;
 font-size: 14px;
 font-weight: 600;
 text-decoration: none;
 display: inline-block;
 transition: transform 0.2s;
}
.btn-primary:hover { transform: translateY(-2px); }
.btn-secondary {
 background: #fff;
 color: #2c5530;
 border: 2px solid #4a7c59;
 padding: 10px 18px;
 border-radius: 6px;
 cursor: pointer;
 font-size: 14px;
 font-weight: 600;
 text-decoration: none;
 display: inline-block;
 transition: all 0.2s;
}
.btn-secondary:hover { background: #e8f5e8; }
.btn-sm { padding: 8px 14px; font-size: 13px; }
.btn-text {
 background: none;
 border: none;
 color: #4a7c59;
 cursor: pointer;
 font-size: 13px;
 padding: 0;
 text-decoration: underline;
 font-weight: 600;
}
.btn-text:hover { color: #2c5530; }
/* btn-text inside the dark header needs white text */
.defaults-note .btn-text,
.calculator-header .btn-text { color: rgba(255,255,255,0.9); }
.defaults-note .btn-text:hover,
.calculator-header .btn-text:hover { color: #fff; }
.button-container { margin-top: 20px; }
.button-bar { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
/* a* choice cards */
.astar-choice {
 display: flex;
 gap: 10px;
 margin-bottom: 14px;
 flex-wrap: wrap;
}
.radio-card {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 12px 16px;
 border: 2px solid #ddd;
 border-radius: 8px;
 cursor: pointer;
 transition: all 0.3s ease;
 flex: 1;
 min-width: 180px;
 background: #f8f9fa;
}
.radio-card:hover { border-color: #4a7c59; background: #e8f5e8; }
.radio-card.active { border-color: #4a7c59; background: #e8f5e8; }
.radio-card input[type="radio"] { accent-color: #4a7c59; }
.radio-label { font-weight: 600; font-size: 14px; color: #333; }
/* Data table */
.data-table-container { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid #e0e0e0; }
.data-table th,
.data-table td { padding: 8px 10px; border-bottom: 1px solid #eee; font-size: 14px; }
.data-table thead { background: linear-gradient(135deg, #4a7c59, #2c5530); color: #fff; }
.data-table thead th { font-weight: 600; }
.data-table input[type="number"] {
 border: 2px solid #ddd;
 border-radius: 4px;
 padding: 8px;
 width: 100%;
 box-sizing: border-box;
 font-size: 14px;
 transition: border-color 0.3s;
}
.data-table input[type="number"]:focus {
 outline: none;
 border-color: #4a7c59;
 box-shadow: 0 0 0 2px rgba(74, 124, 89, 0.2);
}
.table-controls { display: flex; gap: 8px; margin-bottom: 10px; }
.remove-row {
 background: #dc3545;
 color: #fff;
 border: none;
 width: 26px;
 height: 26px;
 border-radius: 50%;
 cursor: pointer;
 font-size: 14px;
 line-height: 1;
}
/* Results */
.results-section {
 background: #f8f9fa;
 border: 1px solid #e0e0e0;
 border-radius: 10px;
 padding: 20px;
 margin: 14px 0;
}
.results-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
 gap: 15px;
}
.result-card {
 background: #fff;
 border: 1px solid #e0e0e0;
 border-radius: 8px;
 padding: 15px;
 text-align: center;
}
.result-card.highlight {
 background: linear-gradient(135deg, #4a7c59, #2c5530);
 color: #fff;
 border-color: #2c5530;
}
.result-label { font-size: 11px; color: #666; text-transform: uppercase; letter-spacing: 0.5px; }
.result-card.highlight .result-label { color: rgba(255,255,255,0.8); }
.result-value { font-size: 22px; font-weight: 700; margin: 6px 0; color: #2c5530; }
.result-card.highlight .result-value { color: #fff; }
.result-unit { font-size: 12px; color: #888; }
.result-card.highlight .result-unit { color: rgba(255,255,255,0.7); }
/* Inline results (a* estimation) */
.inline-results {
 background: #e8f5e8;
 border-left: 4px solid #4a7c59;
 border-radius: 0 8px 8px 0;
 padding: 15px 16px;
 margin-top: 12px;
}
.result-row { display: flex; align-items: baseline; gap: 6px; margin-bottom: 4px; }
.result-tag { font-weight: 600; color: #444; }
.result-val { font-size: 18px; font-weight: 700; color: #2c5530; }
/* Quality indicators */
.quality-indicators { margin-top: 15px; }
.quality-indicators h4 { margin: 0 0 6px; color: #2c5530; }
#quality-message { white-space: pre-line; font-size: 14px; }
/* Calculation details */
.calc-details-wrap { margin-top: 12px; }
.calc-details-wrap summary { cursor: pointer; font-weight: 600; color: #4a7c59; font-size: 14px; }
pre, .calc-details {
 background: #f8f5f9; /* small tweak */
 border: 1px solid #e0e0e0;
 padding: 12px;
 border-radius: 6px;
 overflow: auto;
 font-size: 13px;
 margin-top: 6px;
}
/* CSV preview */
.csv-preview {
 background: #f8f9fa;
 border: 1px solid #e0e0e0;
 border-radius: 8px;
 padding: 15px;
 margin: 12px 0;
}
.csv-preview h4 { margin: 0 0 8px; color: #2c5530; }
.csv-expect {
 font-size: 13px;
 color: #555;
 margin-bottom: 16px;
 line-height: 1.8;
 background: #f8f9fa;
 border: 1px solid #e0e0e0;
 border-radius: 6px;
 padding: 12px;
}
/* Download grid */
.download-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
 gap: 15px;
}
.download-card {
 background: #f8f9fa;
 border: 1px solid #e0e0e0;
 border-radius: 8px;
 padding: 15px;
}
.download-card strong { color: #2c5530; }
.download-card p { font-size: 13px; color: #666; margin: 4px 0 10px; }
/* Help tab */
.help-content { padding: 6px 0; }
.help-content p, .help-content li { font-size: 14px; }
.calculator-section details summary {
 cursor: pointer;
 font-size: 15px;
 color: #2c5530;
 padding: 2px 0;
 font-weight: 600;
}
/* QA summary */
#qa-summary { font-size: 14px; color: #333; }
#qa-summary ul { margin: 6px 0 0 18px; }
#qa-summary .warn { color: #fd7e14; }
#qa-summary .err { color: #dc3545; }
/* Depth table containers */
.depth-table-block { margin-bottom: 18px; }
.depth-table-block h4 { color: #2c5530; margin: 0 0 6px; }
/* Responsive */
@media (max-width: 768px) {
 .calculator-header { padding: 20px; }
 .calculator-header h2 { font-size: 1.6em; }
 .defaults-grid { grid-template-columns: 1fr 1fr; }
 .input-grid { grid-template-columns: 1fr; }
 .astar-choice { flex-direction: column; }
 .results-grid { grid-template-columns: 1fr 1fr; }
 .download-grid { grid-template-columns: 1fr; }
 .calculator-tabs { flex-direction: column; }
}