.dashboard-container{max-width:1400px;margin:0 auto;padding:20px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:15px 0}.header h1{color:var(--primary-dark);font-size:28px;font-weight:500}.header-divider{border:none;height:2px;background-color:var(--primary-light);margin:0 0 20px;transition:background-color .3s}.header-divider.error{background-color:#616161}.api-error-banner{background-color:#6161611a;border:1px solid #616161;border-radius:8px;padding:12px 20px;margin-bottom:20px;color:#424242;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500}.api-error-banner .material-icons{font-size:20px}.header-right{display:flex;align-items:center;gap:15px}.timestamp{color:var(--text-secondary);font-size:14px;display:flex;align-items:center;gap:5px}.navigation{display:flex;gap:10px;margin-bottom:30px;background-color:var(--card-color);padding:10px;border-radius:12px;box-shadow:0 2px 4px #0000000d}.nav-link{display:flex;align-items:center;gap:8px;padding:12px 24px;background:none;border:none;border-radius:8px;color:var(--text-color);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.nav-link:hover{background-color:#2e7d321a;color:var(--primary-color)}.nav-link.active{background-color:var(--primary-color);color:#fff}.nav-link .material-icons{font-size:20px}.main-content{min-height:calc(100vh - 250px)}.footer{display:flex;justify-content:space-between;align-items:center;padding:20px 0;color:var(--text-secondary);font-size:14px;border-top:1px solid #EEEEEE;margin-top:40px;flex-wrap:wrap;gap:10px}.footer-credit{display:flex;align-items:center;gap:4px}.footer-credit a{color:var(--secondary-color);text-decoration:none;transition:color .2s}.footer-credit a:hover{color:var(--secondary-dark);text-decoration:underline}.footer .heart{color:#e91e63;display:inline-block;animation:heartbeat 1.5s ease-in-out infinite}@keyframes heartbeat{0%,to{transform:scale(1)}10%,30%{transform:scale(1.1)}20%,40%{transform:scale(1)}}@media (max-width: 768px){.dashboard-container{padding:10px}.header{flex-direction:column;align-items:flex-start;gap:10px}.header h1{font-size:20px}.navigation{flex-wrap:wrap;padding:8px}.nav-link{flex:1;min-width:calc(50% - 5px);justify-content:center;padding:10px 16px;font-size:13px}.nav-link .material-icons{font-size:18px}.footer{flex-direction:column;text-align:center;font-size:13px}}.parameter-card{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d;display:flex;flex-direction:column;align-items:center;position:relative;border:2px solid transparent;transition:all .3s}.parameter-card:hover{box-shadow:0 6px 12px #0000001a}.parameter-card.warning{border-color:var(--warning-color)}.parameter-card.critical{border-color:var(--danger-color)}.parameter-status{position:absolute;top:15px;right:15px;width:12px;height:12px;border-radius:50%;background-color:var(--success-color)}.parameter-status.warning{background-color:var(--warning-color)}.parameter-status.critical{background-color:var(--danger-color)}.parameter-name{font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:15px;text-align:center}.gauge-container{width:120px;height:60px;margin-bottom:10px}.parameter-value{font-size:32px;font-weight:700;color:var(--text-color);margin-bottom:5px}.parameter-unit{font-size:14px;color:var(--text-secondary);margin-bottom:10px}.parameter-range{font-size:12px;color:var(--text-secondary);text-align:center}@media (max-width: 768px){.parameter-card{padding:15px}.parameter-name{font-size:13px}.gauge-container{width:100px;height:50px}.parameter-value{font-size:28px}.parameter-unit{font-size:13px}.parameter-range{font-size:11px}}@media (max-width: 480px){.parameter-card{padding:12px}.parameter-value{font-size:24px}}.alert-item{display:flex;align-items:flex-start;padding:12px 0;border-bottom:1px solid #EEEEEE}.alert-item:last-child{border-bottom:none}.alert-icon{margin-right:12px;color:var(--warning-color)}.alert-icon.critical{color:var(--danger-color)}.alert-icon.info{color:var(--secondary-color)}.alert-content{flex:1}.alert-title{font-size:14px;font-weight:500;margin-bottom:3px}.alert-time{font-size:12px;color:var(--text-secondary)}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:4px;margin-bottom:8px}.skeleton-card{opacity:.7}.skeleton-status{position:absolute;top:15px;right:15px;width:12px;height:12px;border-radius:50%;background:#e0e0e0;animation:loading 1.5s infinite}.skeleton-gauge{width:120px;height:60px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:50% 50% 0 0;margin:15px 0 10px}.skeleton-icon{width:24px;height:24px;border-radius:50%;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;margin-right:12px;flex-shrink:0}.skeleton-image{width:100%;height:220px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}.skeleton-chart{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.skeleton-chart-area{width:100%;height:350px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:8px;margin-top:20px}.realtime-page{width:100%}.status-indicator-bar{margin-bottom:20px}.status-badge{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:8px;font-weight:500;font-size:14px}.status-badge.status-optimal{background-color:#4caf5026;color:var(--success-color)}.status-badge.status-warning{background-color:#ffc10726;color:var(--warning-color)}.status-badge.status-critical{background-color:#f4433626;color:var(--danger-color)}.content-wrapper{display:grid;grid-template-columns:1fr 400px;gap:20px}.parameters-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.sidebar{display:flex;flex-direction:column;gap:20px}.camera-section,.alerts-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.camera-section h2,.alerts-section h2{font-size:18px;font-weight:500;margin-bottom:15px;color:var(--primary-dark);display:flex;align-items:center;gap:8px}.camera-image{width:100%;height:250px;background-color:#e0e0e0;border-radius:8px;margin-bottom:15px;overflow:hidden}.camera-image img{width:100%;height:100%;object-fit:cover}.camera-controls{display:flex;gap:10px}.camera-button{flex:1;background-color:var(--primary-color);color:#fff;border:none;border-radius:6px;padding:10px 15px;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:background-color .2s}.camera-button:hover{background-color:var(--primary-dark)}.alerts-list{max-height:300px;overflow-y:auto}.skeleton-image{width:100%;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite;border-radius:8px}.loading,.error{text-align:center;padding:5px;font-size:18px;color:var(--text-secondary)}@media (max-width: 1024px){.content-wrapper{grid-template-columns:1fr}.sidebar{grid-template-columns:repeat(2,1fr);grid-auto-flow:column}}@media (max-width: 768px){.parameters-grid{grid-template-columns:repeat(2,1fr);gap:15px}.sidebar{grid-template-columns:1fr}.camera-image{height:200px}.status-badge{font-size:13px;padding:10px 16px}}@media (max-width: 480px){.parameters-grid{grid-template-columns:1fr}.camera-controls{flex-direction:column}.camera-button{width:100%}}.historic-page{width:100%}.date-selector{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d;margin-bottom:20px;display:flex;gap:15px;align-items:flex-end;flex-wrap:wrap}.date-input-group{display:flex;flex-direction:column;flex:1;min-width:200px}.date-input-group label{font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:5px}.date-input-group input{padding:10px;border:1px solid #E0E0E0;border-radius:6px;font-size:14px;font-family:Roboto,sans-serif}.update-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background-color .2s}.update-button:hover{background-color:var(--primary-dark)}.chart-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d;margin-bottom:20px}.chart-section h2{font-size:18px;font-weight:500;margin-bottom:20px;color:var(--primary-dark);display:flex;align-items:center;gap:8px}.chart-container{height:400px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.stats-card{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.stats-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.stats-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;background-color:#2e7d321a;color:var(--primary-color)}.stats-header.ph .stats-icon{background-color:#8e24aa1a;color:#8e24aa}.stats-header.ec .stats-icon{background-color:#f57c001a;color:#f57c00}.stats-header.temperature .stats-icon{background-color:#d32f2f1a;color:#d32f2f}.stats-header.humidity .stats-icon{background-color:#0288d11a;color:#0288d1}.stats-header.co2 .stats-icon{background-color:#7cb3421a;color:#7cb342}.stats-header.oxygen .stats-icon{background-color:#5c6bc01a;color:#5c6bc0}.stats-title{font-size:16px;font-weight:500;color:var(--text-color)}.stats-values{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.stat-item{text-align:center}.stat-value{font-size:24px;font-weight:700;margin-bottom:5px;color:var(--text-color)}.stat-label{font-size:12px;color:var(--text-secondary)}@media (max-width: 768px){.stats-grid{grid-template-columns:1fr}.date-selector{flex-direction:column;align-items:stretch}.date-input-group{min-width:100%}.chart-container{height:300px}.stats-values{gap:10px}}.images-page{width:100%}.controls-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d;margin-bottom:20px;display:flex;gap:15px;align-items:flex-end;flex-wrap:wrap}.date-selector{display:flex;flex-direction:column;flex:1;min-width:200px}.date-selector label{font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:5px}.date-selector input{padding:10px;border:1px solid #E0E0E0;border-radius:6px;font-size:14px;font-family:Roboto,sans-serif}.view-options{display:flex;gap:10px}.view-button{display:flex;align-items:center;gap:5px;padding:10px 20px;background-color:#f5f5f5;border:1px solid #E0E0E0;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.view-button:hover{background-color:#e0e0e0}.view-button.active{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.filter-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:5px;transition:background-color .2s}.filter-button:hover{background-color:var(--primary-dark)}.comparison-section,.gallery-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.comparison-header,.gallery-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:15px}.comparison-title,.gallery-title{font-size:18px;font-weight:500;color:var(--primary-dark);display:flex;align-items:center;gap:8px}.comparison-controls{display:flex;gap:15px;flex-wrap:wrap}.comparison-date{display:flex;flex-direction:column;gap:5px}.comparison-date label{font-size:12px;color:var(--text-secondary)}.comparison-date input{padding:8px;border:1px solid #E0E0E0;border-radius:6px;font-size:14px}.comparison-images{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.comparison-image-container{display:flex;flex-direction:column;gap:10px}.comparison-image{width:100%;height:400px;background-color:#e0e0e0;border-radius:8px;overflow:hidden}.comparison-image img{width:100%;height:100%;object-fit:cover}.comparison-label{text-align:center;font-size:16px;font-weight:500;color:var(--text-color)}.gallery-options{display:flex;gap:10px}.gallery-option{display:flex;align-items:center;gap:5px;padding:8px 16px;background-color:var(--secondary-color);color:#fff;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:background-color .2s}.gallery-option:hover{background-color:var(--secondary-dark)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.gallery-item{background-color:#f5f5f5;border-radius:8px;overflow:hidden;transition:transform .2s}.gallery-item:hover{transform:translateY(-4px);box-shadow:0 6px 12px #0000001a}.gallery-image{width:100%;height:220px;background-color:#e0e0e0;position:relative;overflow:hidden}.gallery-image img{width:100%;height:100%;object-fit:cover}.annotation-marker{position:absolute;width:24px;height:24px;background-color:var(--warning-color);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;cursor:pointer}.annotation-marker:hover .annotation-tooltip{display:block}.annotation-tooltip{display:none;position:absolute;top:30px;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:8px 12px;border-radius:4px;font-size:12px;white-space:nowrap;z-index:10}.gallery-info{padding:15px}.gallery-date{font-size:14px;font-weight:500;color:var(--text-color)}.gallery-time{font-size:12px;color:var(--text-secondary);margin-bottom:10px}.gallery-actions{display:flex;gap:8px}.gallery-action{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:8px 12px;background-color:#fff;border:1px solid #E0E0E0;border-radius:6px;font-size:12px;cursor:pointer;transition:all .2s}.gallery-action:hover{background-color:var(--primary-color);color:#fff;border-color:var(--primary-color)}.gallery-action .material-icons{font-size:16px}@media (max-width: 768px){.comparison-images{grid-template-columns:1fr}.comparison-image{height:300px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}.controls-section{padding:15px}.view-button{padding:8px 16px;font-size:13px}.gallery-header{flex-direction:column;align-items:flex-start}.gallery-options{width:100%;flex-direction:column}.gallery-option{width:100%;justify-content:center}}@media (max-width: 480px){.gallery-grid{grid-template-columns:1fr}.comparison-controls{flex-direction:column;width:100%}.comparison-date{width:100%}}.summary-page{width:100%}.status-overview{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.status-info{display:flex;align-items:center;gap:20px}.status-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center}.status-icon.optimal{background-color:#4caf5026;color:var(--success-color)}.status-icon.warning{background-color:#ffc10726;color:var(--warning-color)}.status-icon.critical{background-color:#f4433626;color:var(--danger-color)}.status-icon .material-icons{font-size:32px}.status-text h2{font-size:20px;font-weight:500;margin-bottom:5px;color:var(--text-color)}.status-text p{font-size:14px;color:var(--text-secondary)}.status-metrics{display:flex;gap:30px}.status-metric{text-align:center}.status-metric-value{font-size:32px;font-weight:700;color:var(--primary-color);margin-bottom:5px}.status-metric-label{font-size:12px;color:var(--text-secondary)}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:20px}.kpi-card{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.kpi-header{display:flex;align-items:center;gap:12px;margin-bottom:15px}.kpi-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;background-color:#2e7d321a;color:var(--primary-color)}.kpi-icon.yield{background-color:#4caf501a;color:#4caf50}.kpi-icon.water{background-color:#0288d11a;color:#0288d1}.kpi-icon.nutrients{background-color:#f57c001a;color:#f57c00}.kpi-icon.energy{background-color:#ffc1071a;color:#ffc107}.kpi-title{font-size:14px;font-weight:500;color:var(--text-secondary)}.kpi-value{font-size:28px;font-weight:700;color:var(--text-color);margin-bottom:10px}.kpi-change{font-size:13px;display:flex;align-items:center;gap:5px}.kpi-change.positive{color:var(--success-color)}.kpi-change.negative{color:var(--danger-color)}.kpi-change .material-icons{font-size:16px}.content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:20px}.alerts-section,.tasks-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.section-title{font-size:18px;font-weight:500;color:var(--primary-dark);display:flex;align-items:center;gap:8px}.task-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #EEEEEE}.task-item:last-child{border-bottom:none}.task-checkbox{width:20px;height:20px;border:2px solid #E0E0E0;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer}.task-checkbox.checked{background-color:var(--success-color);border-color:var(--success-color);color:#fff}.task-checkbox .material-icons{font-size:16px}.task-content{flex:1}.task-title{font-size:14px;font-weight:500;margin-bottom:3px}.task-date{font-size:12px;color:var(--text-secondary)}.task-priority{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.task-priority.high{background-color:#f4433626;color:var(--danger-color)}.task-priority.medium{background-color:#ffc10726;color:var(--warning-color)}.task-priority.low{background-color:#4caf5026;color:var(--success-color)}.recommendations-section{background-color:var(--card-color);border-radius:12px;padding:20px;box-shadow:0 4px 6px #0000000d}.recommendation-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid #EEEEEE}.recommendation-item:last-child{border-bottom:none}.recommendation-icon{color:var(--primary-color)}.recommendation-content{flex:1}.recommendation-title{font-size:14px;font-weight:500;margin-bottom:3px}.recommendation-description{font-size:14px;color:var(--text-secondary)}.chart-container{height:200px;margin-top:20px}.error-state{text-align:center;padding:80px 20px;background-color:var(--card-color);border-radius:12px;box-shadow:0 2px 8px #00000014;max-width:500px;margin:40px auto}.error-state .material-icons{font-size:48px;color:#9e9e9e;margin-bottom:16px;opacity:.7}.error-state h2{font-size:20px;color:var(--text-color);margin-bottom:8px;font-weight:500}.error-state p{font-size:14px;color:var(--text-secondary);margin-bottom:24px;line-height:1.5}.retry-button{background-color:#757575;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background-color .2s}.retry-button:hover{background-color:#616161}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width: 1024px){.content-grid{grid-template-columns:1fr}.status-overview{flex-direction:column;align-items:flex-start}.status-metrics{width:100%;justify-content:space-between}}@media (max-width: 768px){.kpi-grid{grid-template-columns:1fr}.status-metrics{flex-direction:column;gap:15px}.status-info{flex-direction:column;align-items:flex-start;gap:15px}.status-text h2{font-size:18px}.status-text p{font-size:13px}.kpi-value{font-size:24px}.chart-container{height:250px}}@media (max-width: 480px){.status-metric-value{font-size:24px}.status-icon{width:50px;height:50px}.status-icon .material-icons{font-size:28px}.task-item{flex-wrap:wrap}.task-priority{width:100%;text-align:center;margin-top:8px}}:root{--primary-color: #2E7D32;--primary-light: #60AD5E;--primary-dark: #005005;--secondary-color: #0277BD;--secondary-light: #58A5F0;--secondary-dark: #004C8C;--background-color: #F5F9F5;--card-color: #FFFFFF;--text-color: #212121;--text-secondary: #757575;--success-color: #4CAF50;--warning-color: #FFC107;--danger-color: #F44336;--ph-color: #8E24AA;--ec-color: #F57C00;--temp-color: #D32F2F;--humidity-color: #0288D1;--co2-color: #7CB342;--oxygen-color: #5C6BC0}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6}#root{min-height:100vh}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}@media (max-width: 768px){body{font-size:14px}h1{font-size:22px}h2{font-size:18px}}@media (max-width: 480px){body{font-size:13px}}