*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,sans-serif;background:linear-gradient(135deg,#14532d 0%,#15803d 100%);min-height:100vh;color:#1e293b;line-height:1.6}
.container{max-width:1200px;margin:0 auto;padding:20px}
header{background:linear-gradient(135deg,#22c55e,#16a34a);padding:35px;border-radius:12px;margin-bottom:30px;box-shadow:0 8px 32px rgba(0,0,0,.2);text-align:center}
header h1{color:#fff;font-size:2.8em;margin-bottom:5px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}
.tagline{color:#dcfce7;font-size:1.1em;margin-bottom:15px}
nav{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
nav a{color:#fff;text-decoration:none;padding:10px 20px;background:rgba(255,255,255,.15);border-radius:6px;transition:all .3s;backdrop-filter:blur(10px)}
nav a:hover{background:rgba(255,255,255,.25);transform:translateY(-2px)}
.stats-bar{display:flex;gap:20px;margin-bottom:30px;justify-content:center;flex-wrap:wrap}
.stat-item{background:rgba(255,255,255,.9);padding:20px 30px;border-radius:12px;text-align:center;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.stat-num{display:block;font-size:2.5em;font-weight:700;color:#16a34a;line-height:1}
.search-section{background:#fff;padding:30px;border-radius:12px;margin-bottom:30px;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.type-toggle{display:flex;gap:10px;margin-bottom:20px}
.type-toggle button{flex:1;padding:15px;background:#f1f5f9;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;font-size:1.1em;font-weight:600;color:#475569;transition:all .3s}
.type-toggle button.active{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border-color:#16a34a}
.type-toggle button:hover{transform:translateY(-2px)}
.search-form{display:grid;grid-template-columns:1fr 1fr auto auto;gap:10px}
.search-form input{padding:12px;border:2px solid #e2e8f0;border-radius:6px;font-size:1em}
.search-form input:focus{outline:none;border-color:#22c55e}
.search-form button{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;padding:12px 30px;border:none;border-radius:6px;font-weight:600;cursor:pointer}
.rides-list{background:#fff;padding:30px;border-radius:12px;margin-bottom:30px;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.rides-list h2{color:#16a34a;margin-bottom:25px;font-size:1.8em}
.ride-card{background:#f8fafc;padding:25px;border-radius:12px;margin-bottom:20px;border:2px solid #e2e8f0;transition:all .3s}
.ride-card:hover{border-color:#22c55e;box-shadow:0 4px 20px rgba(34,197,94,.2);transform:translateY(-2px)}
.ride-route{display:flex;align-items:center;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.route-point{flex:1;min-width:200px}
.route-label{display:block;color:#64748b;font-size:.9em;margin-bottom:5px}
.route-point strong{color:#16a34a;font-size:1.3em}
.route-arrow{font-size:2em;color:#22c55e;font-weight:700}
.ride-details{display:flex;gap:20px;margin-bottom:15px;flex-wrap:wrap;font-size:.95em}
.detail-item{background:#fff;padding:8px 15px;border-radius:20px;border:1px solid #e2e8f0}
.ride-desc{color:#475569;margin-bottom:15px}
.btn-view{display:inline-block;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;padding:10px 20px;border-radius:6px;text-decoration:none;font-weight:600;transition:all .3s}
.btn-view:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(34,197,94,.3)}
.box,.detail-box{background:#fff;padding:30px;border-radius:12px;margin-bottom:30px;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.box h2{color:#16a34a;margin-bottom:20px;font-size:1.8em}
.detail-box{position:relative}
.type-badge,.type-badge-small{display:inline-block;padding:8px 16px;border-radius:20px;font-size:.9em;font-weight:700;margin-bottom:20px}
.type-badge-small{padding:4px 10px;font-size:.85em}
.type-offer{background:#dcfce7;color:#15803d}
.type-search{background:#dbeafe;color:#1e40af}
.route-display{display:flex;align-items:center;gap:30px;margin-bottom:30px;padding:30px;background:#f1f5f9;border-radius:12px;flex-wrap:wrap}
.route-city{flex:1;min-width:200px;text-align:center}
.route-label-big{display:block;color:#64748b;font-size:.9em;margin-bottom:5px}
.route-city h2{color:#16a34a;font-size:2em}
.route-city p{color:#475569}
.route-arrow-big{font-size:3em;color:#22c55e;font-weight:700}
.detail-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:30px}
.info-card{background:#f8fafc;padding:15px;border-radius:8px;border:1px solid #e2e8f0}
.section{margin-bottom:30px}
.section h3{color:#16a34a;margin-bottom:15px;font-size:1.3em}
.contact-info{background:#f1f5f9;padding:20px;border-radius:8px}
.contact-info div{margin-bottom:10px}
.contact-info a{color:#16a34a;text-decoration:none}
.contact-info a:hover{text-decoration:underline}
.form-group{margin-bottom:20px}
.form-group label{display:block;margin-bottom:8px;color:#16a34a;font-weight:600}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
input[type="text"],input[type="email"],input[type="tel"],input[type="date"],input[type="time"],input[type="number"],input[type="password"],textarea,select{width:100%;padding:12px;border:2px solid #e2e8f0;border-radius:6px;font-size:1em;transition:all .3s}
input:focus,textarea:focus,select:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.1)}
textarea{resize:vertical;font-family:inherit}
button,.btn-small,.btn-del,.btn-post{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;padding:12px 24px;border:none;border-radius:6px;cursor:pointer;font-size:1em;font-weight:600;transition:all .3s;box-shadow:0 4px 15px rgba(34,197,94,.3);text-decoration:none;display:inline-block}
button:hover,.btn-post:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(34,197,94,.4)}
.btn-small{padding:6px 12px;font-size:.9em;margin-right:5px}
.btn-del{background:linear-gradient(135deg,#dc2626,#991b1b);box-shadow:0 4px 15px rgba(220,38,38,.3)}
.error{background:#fef2f2;border:2px solid #fca5a5;color:#991b1b;padding:15px;border-radius:8px;margin-bottom:20px;font-weight:500}
.success{background:#f0fdf4;border:2px solid #86efac;color:#166534;padding:15px;border-radius:8px;margin-bottom:20px;font-weight:500}
.empty{text-align:center;padding:60px 20px;color:#64748b}
.empty p{font-size:1.2em;margin-bottom:20px}
.alert-box{background:#fef3c7;border:2px solid #fbbf24;color:#78350f;padding:15px;border-radius:8px;margin-bottom:20px;font-weight:500}
table{width:100%;border-collapse:collapse;margin-top:20px}
table th{background:#f1f5f9;color:#16a34a;padding:15px;text-align:left;font-weight:600;border-bottom:2px solid #e2e8f0}
table td{padding:15px;border-bottom:1px solid #e2e8f0}
table tr:hover{background:#f8fafc}
.badge-on,.badge-pending{padding:4px 12px;border-radius:20px;font-size:.85em;font-weight:600}
.badge-on{background:#dcfce7;color:#166534}
.badge-pending{background:#fef3c7;color:#78350f}
footer{text-align:center;padding:30px;color:#dcfce7;margin-top:50px}
@media(max-width:768px){
header h1{font-size:2em}
.search-form{grid-template-columns:1fr}
.form-row{grid-template-columns:1fr}
.route-display,.ride-route{flex-direction:column;text-align:center}
.stats-bar{flex-direction:column}
}