/* assets/css/widgets.css — weather, rates, converters */

/* ══ WEATHER ══ */
.wx-featured{
  display:flex;justify-content:space-between;align-items:center;
  background:linear-gradient(135deg,var(--AL),var(--ALD));
  border-radius:18px;padding:18px 20px;margin-bottom:14px;gap:14px;
  border:1px solid rgba(0,200,150,0.18);
}
.wx-feat-left{display:flex;flex-direction:column;gap:4px}
.wx-feat-icon{font-size:56px;line-height:1;margin-bottom:6px}
.wx-feat-temps{display:flex;align-items:baseline;gap:7px;line-height:1;margin-bottom:6px}
.wx-hi{font-size:36px;font-weight:900;color:var(--AD)}
.wx-lo{font-size:20px;font-weight:600;color:var(--AM);opacity:0.75}
.wx-feat-desc{font-size:15px;color:var(--A);font-weight:800}
.wx-feat-right{display:flex;flex-direction:column;gap:8px;align-items:flex-end;flex-shrink:0}
.wx-meta-row{
  font-size:13px;color:var(--MT);display:flex;align-items:center;gap:6px;
  background:var(--S);border-radius:11px;padding:7px 13px;
  min-width:110px;justify-content:space-between;border:1px solid var(--B);
}
.wx-meta-row .wx-mv{font-weight:800;color:var(--T);font-size:14px}
.wx-strip{
  display:flex;gap:8px;overflow-x:auto;padding-bottom:5px;
  margin-bottom:12px;-webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.wx-strip::-webkit-scrollbar{display:none}
.wx-day{
  min-width:72px;flex-shrink:0;background:var(--S3);
  border-radius:16px;padding:12px 7px 10px;text-align:center;
  cursor:pointer;border:1.5px solid transparent;transition:all 0.15s;
}
.wx-day.sel{background:var(--AL);border-color:var(--A);box-shadow:0 0 0 2px rgba(0,200,150,0.12)}
.wx-day-name{font-size:12px;color:var(--HT);font-weight:800;margin-bottom:6px;white-space:nowrap}
.wx-day.sel .wx-day-name{color:var(--AM)}
.wx-day-icon{font-size:26px;line-height:1;margin-bottom:7px}
.wx-day-hi{font-size:15px;font-weight:800;color:var(--T)}
.wx-day-lo{font-size:12px;color:var(--HT);margin-top:2px;font-weight:600}
.wx-detail{background:var(--S3);border-radius:18px;padding:16px 18px;animation:wxfade 0.18s ease;border:1px solid var(--B)}
@keyframes wxfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wx-detail-hdr{display:flex;align-items:center;gap:14px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--B)}
.wx-detail-icon{font-size:40px;line-height:1}
.wx-detail-name{font-size:16px;font-weight:800;color:var(--T)}
.wx-detail-desc{font-size:14px;color:var(--MT);margin-top:4px;font-weight:500}
.wx-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wx-gi{background:var(--S);border-radius:14px;padding:13px 15px;border:1px solid var(--B)}
.wx-gi-val{font-size:22px;font-weight:800;color:var(--T);line-height:1;margin-bottom:4px}
.wx-gi-val small{font-size:13px;font-weight:600;color:var(--MT)}
.wx-gi-lbl{font-size:13px;color:var(--HT);font-weight:600}

/* ══ RATES ══ */
.rates-hdr-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;flex-wrap:wrap;gap:8px}
.live-badge{
  display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(135deg,var(--AL),var(--ALD));
  color:var(--AM);border-radius:99px;padding:6px 14px;
  font-size:13px;font-weight:800;border:1px solid rgba(0,200,150,0.25);
}
.live-dot{width:7px;height:7px;border-radius:50%;background:var(--A);animation:pulse 2s ease infinite;flex-shrink:0}
.rates-upd{font-size:12px;color:var(--HT);margin-top:2px;font-weight:500}
.rates-refresh{
  background:var(--S3);border:1.5px solid var(--BM);border-radius:99px;
  padding:6px 16px;font-size:13px;font-weight:700;cursor:pointer;
  color:var(--MT);font-family:inherit;transition:all 0.15s;
}
.rates-refresh:hover{border-color:var(--A);color:var(--A)}
.rates-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rate-card{
  background:var(--S3);border-radius:18px;padding:16px 17px;
  border:1px solid var(--B);transition:all 0.15s;
}
.rate-card:hover{border-color:var(--BM);box-shadow:var(--shadow)}
.rate-card.full{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px}
.rate-card.full .rate-val{font-size:30px}
.rate-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.rate-flag{font-size:22px;line-height:1}
.rate-pair{font-size:11px;font-weight:800;color:var(--HT);letter-spacing:0.05em;text-transform:uppercase;background:var(--S2);padding:3px 8px;border-radius:7px}
.rate-val{font-size:26px;font-weight:900;color:var(--T);line-height:1;font-variant-numeric:tabular-nums;direction:ltr;text-align:left}
.rate-val small{font-size:13px;font-weight:600;color:var(--MT)}
.rate-lbl{font-size:13px;color:var(--MT);margin-top:5px;font-weight:600}
.rate-chg{font-size:12px;font-weight:800;border-radius:9px;padding:4px 9px;display:inline-block;margin-top:7px}
.rate-chg.up{color:#059669;background:rgba(5,150,105,0.12)}
.rate-chg.dn{color:#DC2626;background:rgba(220,38,38,0.09)}
.rate-chg.neu{color:var(--HT);background:var(--S2)}
@media(max-width:360px){.rates-grid{grid-template-columns:1fr}.rate-card.full{flex-direction:column;align-items:flex-start}}

/* ══ CONVERTERS ══ */
.conv-selects{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.conv-selects select{
  width:100%;font-size:15px;padding:12px 14px;
  border-radius:14px;border:1.5px solid var(--BM);
  background:var(--S3);color:var(--T);font-family:inherit;
  outline:none;-webkit-appearance:none;appearance:none;
  font-weight:600;transition:border-color 0.15s;
}
.conv-selects select:focus{border-color:var(--A)}
.conv-nums{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;margin-bottom:13px}
.conv-nums input{
  width:100%;min-width:0;font-size:16px;padding:12px 10px;
  border-radius:14px;border:1.5px solid var(--BM);
  background:var(--S3);color:var(--T);font-family:inherit;
  outline:none;-webkit-appearance:none;appearance:none;
  font-weight:700;text-align:center;transition:border-color 0.15s;
}
.conv-nums input:focus,.conv-selects select:focus{border-color:var(--A)}
.conv-btn{
  width:100%;padding:15px;
  background:linear-gradient(135deg,var(--A),var(--AM));
  color:#fff;border:none;border-radius:14px;font-size:16px;
  cursor:pointer;font-family:inherit;font-weight:800;
  box-shadow:0 4px 14px rgba(0,200,150,0.35);transition:all 0.15s;
}
.conv-btn:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(0,200,150,0.45)}
.conv-res{
  margin-top:13px;padding:16px;background:var(--AL);
  border-radius:14px;font-size:18px;color:var(--AM);
  font-weight:800;text-align:center;min-height:52px;
  display:flex;align-items:center;justify-content:center;
  line-height:1.4;border:1px solid rgba(0,200,150,0.25);
}
@media(max-width:400px){.conv-selects{grid-template-columns:1fr}}

/* ══ UNIT CONVERTER ══ */
.uc-tabs{display:flex;gap:8px;margin-bottom:16px}
.uc-tab{
  flex:1;padding:11px 8px;font-size:14px;font-weight:700;
  border-radius:14px;border:1.5px solid var(--BM);
  background:transparent;color:var(--MT);cursor:pointer;
  font-family:inherit;transition:all 0.15s;text-align:center;
}
.uc-tab.on{background:linear-gradient(135deg,var(--AL),var(--ALD));color:var(--AM);border-color:var(--A)}
.uc-row{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:end;margin-bottom:12px}
.uc-field{display:flex;flex-direction:column;gap:6px}
.uc-field label{font-size:12px;font-weight:700;color:var(--HT);letter-spacing:0.03em}
.uc-field input,.uc-field select{
  width:100%;font-size:16px;padding:12px 13px;
  border-radius:14px;border:1.5px solid var(--BM);
  background:var(--S3);color:var(--T);font-family:inherit;
  outline:none;font-weight:700;text-align:center;
  transition:border-color 0.15s;-webkit-appearance:none;appearance:none;
}
.uc-field input:focus,.uc-field select:focus{border-color:var(--A)}
.uc-arrow{
  font-size:22px;color:var(--A);font-weight:900;
  padding-bottom:12px;text-align:center;cursor:pointer;user-select:none;
}
.uc-res-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
.uc-res-item{background:var(--S3);border-radius:14px;padding:13px 15px;border:1px solid var(--B)}
.uc-res-val{font-size:20px;font-weight:800;color:var(--T);line-height:1;direction:ltr;text-align:left}
.uc-res-lbl{font-size:12px;color:var(--HT);margin-top:5px;font-weight:600}

/* ══ FX CONVERTER ══ */
.fx-field{
  background:var(--S3);border:1.5px solid var(--B);
  border-radius:16px;padding:15px 16px 13px;
  transition:border-color 0.18s;margin-bottom:10px;
}
.fx-field:focus-within{border-color:var(--A);box-shadow:0 0 0 3px rgba(0,200,150,0.09)}
.fx-field-lbl{font-size:11px;color:var(--HT);font-weight:800;letter-spacing:0.07em;text-transform:uppercase;margin-bottom:10px}
.fx-field-inner{display:flex;align-items:center;gap:12px}
.fx-cur-pick{
  display:flex;align-items:center;gap:9px;cursor:pointer;
  min-width:120px;padding:8px 12px;border-radius:12px;
  background:var(--S);border:1px solid var(--B);
  transition:all 0.12s;flex-shrink:0;
}
.fx-cur-pick:hover{background:var(--S2);border-color:var(--BM)}
.fx-cur-flag{font-size:22px;line-height:1;flex-shrink:0}
.fx-cur-code{font-size:14px;font-weight:900;color:var(--T);line-height:1.3}
.fx-cur-name{font-size:11px;color:var(--HT);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-chevron{font-size:11px;color:var(--HT);flex-shrink:0}
.fx-amount-inp{
  flex:1;background:transparent;border:none;outline:none;
  font-family:var(--F);font-size:24px;font-weight:800;
  color:var(--T);direction:ltr;text-align:left;min-width:0;width:100%;
}
.fx-amount-inp::placeholder{color:var(--HT)}
.fx-result-val{
  flex:1;font-size:24px;font-weight:900;color:var(--A);
  direction:ltr;text-align:left;min-width:0;word-break:break-all;line-height:1.2;
}
.fx-divider{display:flex;align-items:center;gap:10px;margin:10px 0}
.fx-divider-line{flex:1;height:1px;background:var(--B)}
.fx-swap-btn{
  width:40px;height:40px;border-radius:50%;background:var(--AL);
  border:1.5px solid rgba(0,200,150,0.3);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;color:var(--A);transition:all 0.2s;flex-shrink:0;font-family:inherit;
}
.fx-swap-btn:hover{background:linear-gradient(135deg,var(--A),var(--AM));color:#fff;box-shadow:0 4px 12px rgba(0,200,150,0.35)}
.fx-swap-btn:active{transform:rotate(180deg)}
.fx-rate-row{display:flex;align-items:center;justify-content:space-between;margin-top:13px;padding-top:13px;border-top:1px solid var(--B);font-size:13px;flex-wrap:wrap;gap:7px}
.fx-rate-txt{color:var(--HT);display:flex;align-items:center;gap:6px}
.fx-rate-v{color:var(--T);font-weight:800}
.fx-quick-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.fx-quick-btn{
  background:var(--S3);border:1.5px solid var(--B);border-radius:99px;
  padding:7px 14px;font-family:var(--F);font-size:13px;
  font-weight:700;color:var(--MT);cursor:pointer;transition:all 0.12s;
}
.fx-quick-btn:hover{border-color:var(--A);color:var(--A);background:var(--AL)}
.fx-pop-title{
  font-size:11px;font-weight:800;color:var(--HT);
  letter-spacing:0.07em;text-transform:uppercase;
  margin:16px 0 10px;display:flex;align-items:center;gap:7px;
}
.fx-pop-title::before{content:'';width:3px;height:13px;background:linear-gradient(to bottom,var(--A2),var(--AM));border-radius:2px;flex-shrink:0}
.fx-pop-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.fx-pop-item{
  background:var(--S3);border:1px solid var(--B);border-radius:14px;
  padding:11px 13px;display:flex;align-items:center;gap:9px;
  cursor:pointer;transition:all 0.12s;
}
.fx-pop-item:hover{border-color:var(--A);background:var(--AL)}
.fx-pop-flag{font-size:18px;flex-shrink:0;line-height:1}
.fx-pop-code{font-size:13px;font-weight:800;color:var(--T)}
.fx-pop-name{font-size:11px;color:var(--HT);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-pop-val{font-size:13px;font-weight:700;color:var(--MT);direction:ltr;text-align:left;flex-shrink:0}
@media(max-width:400px){.fx-pop-grid{grid-template-columns:1fr}}

/* ══ FX MODAL ══ */
.fx-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:300;align-items:flex-end;justify-content:center;padding:12px;backdrop-filter:blur(5px)}
.fx-modal-overlay.open{display:flex}
.fx-modal{background:var(--S);border:1px solid var(--BM);border-radius:24px 24px 0 0;width:100%;max-width:500px;max-height:82vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow-lg)}
@media(min-width:600px){.fx-modal{border-radius:24px;max-height:72vh;align-self:center}}
.fx-modal-head{padding:17px 20px;border-bottom:1px solid var(--B);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.fx-modal-title{font-size:16px;font-weight:800;color:var(--T)}
.fx-modal-close{background:var(--S3);border:1px solid var(--B);color:var(--MT);width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:all 0.12s}
.fx-modal-close:hover{background:var(--S2);color:var(--T)}
.fx-search-wrap{padding:12px 18px;border-bottom:1px solid var(--B);flex-shrink:0}
.fx-search{width:100%;background:var(--S3);border:1.5px solid var(--B);border-radius:14px;padding:10px 15px;font-family:var(--F);font-size:15px;color:var(--T);outline:none;direction:ltr;transition:border-color 0.18s}
.fx-search:focus{border-color:var(--A)}
.fx-modal-list{overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}
.fx-modal-item{display:flex;align-items:center;gap:14px;padding:13px 20px;cursor:pointer;transition:background 0.1s;border-bottom:1px solid var(--B)}
.fx-modal-item:hover{background:var(--S2)}
.fx-modal-item.fxsel{background:var(--AL);border-right:3px solid var(--A)}
.fxi-flag{width:30px;font-size:22px;text-align:center;flex-shrink:0;line-height:1}
.fxi-code{font-size:14px;font-weight:800;color:var(--T);min-width:46px;direction:ltr}
.fxi-name{flex:1;font-size:13px;color:var(--MT);font-weight:600}
.fxi-rate{font-size:13px;color:var(--HT);direction:ltr;flex-shrink:0}