* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Noto Sans Bengali', 'SolaimanLipi', Arial, sans-serif;
  background: #f7f8fb;
  color: #1f2430;
  line-height: 1.7;
}

.container { max-width: 900px; margin: 0 auto; padding: 0 20px; }

.site-header {
  background: #0e6b4f;
  color: #fff;
  padding: 16px 0;
}
.site-header .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.logo { color: #fff; font-size: 1.4rem; font-weight: 700; text-decoration: none; }
.logo span { color: #ffd166; }
.site-header nav a {
  color: #f1f5f3; text-decoration: none; margin-left: 18px; font-size: 0.95rem;
}
.site-header nav a:hover { color: #ffd166; }

.hero { text-align: center; padding: 40px 0 20px; }
.hero h1 { font-size: 2rem; color: #0e6b4f; margin-bottom: 10px; }
.hero .subtitle { color: #4a5568; max-width: 600px; margin: 0 auto; }
.today-line { margin-top: 14px; font-size: 0.95rem; color: #2d3748; }

.converter-box {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  padding: 24px;
  margin: 24px 0;
}

.tabs { display: flex; gap: 8px; margin-bottom: 20px; }
.tab-btn {
  flex: 1;
  padding: 12px;
  border: none;
  border-radius: 8px;
  background: #eef1f0;
  cursor: pointer;
  font-size: 1rem;
  font-family: inherit;
  color: #333;
}
.tab-btn.active { background: #0e6b4f; color: #fff; }

.convert-form.hidden { display: none; }

.field-row { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.field { flex: 1; min-width: 100px; }
.field label { display: block; margin-bottom: 6px; font-size: 0.9rem; color: #555; }
.field input, .field select {
  width: 100%;
  padding: 10px;
  border: 1px solid #d5dbdd;
  border-radius: 8px;
  font-size: 1rem;
  font-family: inherit;
}

.convert-btn {
  width: 100%;
  padding: 14px;
  background: #0e6b4f;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 1.05rem;
  cursor: pointer;
}
.convert-btn:hover { background: #0b5540; }

.result-box {
  margin-top: 20px;
  padding: 18px;
  border-radius: 8px;
  text-align: center;
}
.result-box.success { background: #e7f6ef; border: 1px solid #b7e4cd; }
.result-box.error { background: #fdecea; border: 1px solid #f5c2c0; color: #a33; }
.result-label { font-size: 0.85rem; color: #4a5568; }
.result-value { font-size: 1.4rem; font-weight: 700; color: #0e6b4f; margin: 6px 0; }
.result-weekday { font-size: 0.95rem; color: #4a5568; }

.content-section { margin: 40px 0; background: #fff; padding: 28px; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.content-section h2 { color: #0e6b4f; margin: 22px 0 10px; font-size: 1.3rem; }
.content-section h2:first-child { margin-top: 0; }
.content-section p { margin-bottom: 10px; color: #333; }
.faq h3 { margin-top: 16px; font-size: 1.05rem; color: #1f2430; }

.site-footer { background: #0e6b4f; color: #eaf4ef; padding: 20px 0; margin-top: 40px; text-align: center; font-size: 0.9rem; }
.site-footer nav { margin-top: 8px; }
.site-footer a { color: #ffd166; text-decoration: none; margin: 0 4px; }

.cal-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; flex-wrap: wrap; gap: 10px; }
.cal-nav-btn { text-decoration: none; color: #0e6b4f; font-weight: 600; padding: 8px 12px; border: 1px solid #cfe8dc; border-radius: 6px; }
.cal-nav-btn:hover { background: #eef8f3; }
.cal-title { color: #1f2430; font-size: 1.2rem; }

.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-head { text-align: center; font-weight: 700; color: #0e6b4f; padding: 6px 0; font-size: 0.85rem; }
.cal-cell {
  position: relative;
  min-height: 64px;
  background: #f7faf8;
  border-radius: 6px;
  padding: 6px;
  text-align: center;
}
.cal-cell.empty { background: transparent; }
.cal-cell.today { background: #0e6b4f; color: #fff; }
.cal-cell.today .bn-date { color: #ffd166; }
.cal-cell .eng-date { display: block; font-weight: 700; font-size: 1rem; }
.cal-cell .bn-date { display: block; font-size: 0.75rem; color: #4a5568; margin-top: 2px; }
.cal-cell.today .eng-date { color: #fff; }
.cal-cell.has-event { border: 1.5px solid #ffd166; }
.event-dot { position: absolute; bottom: 4px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #e07a3f; }

.event-list { list-style: none; padding: 0; }
.event-list li { padding: 8px 0; border-bottom: 1px solid #eee; }
.event-list li:last-child { border-bottom: none; }

.rashi-grid, .rates-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.rashi-card, .rate-card {
  background: #fff;
  border-radius: 12px;
  padding: 18px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
}
.rashi-card h2 { color: #0e6b4f; font-size: 1.1rem; margin-bottom: 8px; }
.rashi-card p { font-size: 0.9rem; margin-bottom: 6px; color: #333; }
.lucky-line { color: #4a5568; font-size: 0.85rem !important; margin-top: 8px !important; }

.rate-card { text-align: center; }
.rate-card h2 { font-size: 1rem; color: #4a5568; margin-bottom: 10px; }
.rate-value { font-size: 1.6rem; font-weight: 700; color: #0e6b4f; }

@media (max-width: 600px) {
  .cal-cell { min-height: 50px; padding: 4px; }
  .cal-cell .eng-date { font-size: 0.85rem; }
  .cal-cell .bn-date { font-size: 0.65rem; }

  .site-header .container { flex-direction: column; gap: 10px; }
  .hero h1 { font-size: 1.5rem; }
}