@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans:ital,wght@0,300..800;1,300..800&display=swap');

html:root{--fn:'Sofia Sans',Arial,sans-serif!important;--mo:'Sofia Sans',Arial,sans-serif!important;--font:'Sofia Sans',Arial,sans-serif!important}
html body,html body button,html body input,html body select,html body textarea,html body table,html body th,html body td,html body label,html body a,html body div,html body span,html body p,html body h1,html body h2,html body h3,html body h4,html body h5,html body h6{font-family:'Sofia Sans',Arial,sans-serif!important}

.bg-date-control,.bg-file-control{position:relative;width:100%;min-width:0;font-family:inherit}
.bg-date-control *,.bg-date-picker *,.bg-file-control *{box-sizing:border-box}
.bg-date-control>input[type="date"],.bg-date-control>input[type="datetime-local"],.bg-date-control>input[type="month"]{position:absolute!important;width:1px!important;height:1px!important;left:0!important;bottom:0!important;margin:0!important;padding:0!important;opacity:0!important;pointer-events:none!important}
.bg-date-display{min-height:40px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:8px;background:var(--sur2,#f7f7fb);color:var(--tx,#1a1a2e);font:inherit;text-align:left;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s}
.bg-date-display:hover{border-color:color-mix(in srgb,var(--acc,#6c63ff) 55%,var(--brd,var(--br,#dfe1ea)));background:var(--sur,#fff)}
.bg-date-display:focus-visible{outline:0;border-color:var(--acc,#6c63ff);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#6c63ff) 14%,transparent)}
.bg-date-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.bg-date-value.is-empty{color:var(--tx3,var(--tx2,#7c8294))}
.bg-date-calendar{position:relative;width:16px;height:15px;flex:0 0 16px;border:1.5px solid currentColor;border-radius:3px;color:var(--tx3,var(--tx2,#7c8294))}
.bg-date-calendar:before{content:"";position:absolute;left:2px;right:2px;top:4px;border-top:1.5px solid currentColor}
.bg-date-calendar:after{content:"";position:absolute;left:3px;top:-3px;width:2px;height:4px;border-radius:2px;background:currentColor;box-shadow:6px 0 0 currentColor}
.bg-date-control.is-disabled .bg-date-display{opacity:.58;cursor:not-allowed}

.bg-date-picker{position:fixed;z-index:2147483000;display:none;overflow:auto;padding:12px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:8px;background:var(--sur,#fff);color:var(--tx,#1a1a2e);font-family:inherit;box-shadow:0 18px 50px rgba(19,24,45,.2)}
.bg-date-picker.is-open{display:block}
.bg-picker-header{height:38px;display:grid;grid-template-columns:36px minmax(0,1fr) 36px;align-items:center;margin-bottom:8px}
.bg-picker-title{text-align:center;font-size:14px;font-weight:750;text-transform:capitalize}
.bg-picker-nav{width:34px;height:34px;display:grid;place-items:center;padding:0;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:7px;background:var(--sur2,#f7f7fb);color:var(--tx,#1a1a2e);font:700 22px/1 inherit;cursor:pointer}
.bg-picker-nav:hover,.bg-picker-nav:focus-visible{outline:0;border-color:var(--acc,#6c63ff);color:var(--acc,#6c63ff);background:color-mix(in srgb,var(--acc,#6c63ff) 7%,var(--sur,#fff))}
.bg-picker-weekdays,.bg-picker-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.bg-picker-weekdays{margin-bottom:4px}
.bg-picker-weekdays span{height:26px;display:grid;place-items:center;color:var(--tx3,var(--tx2,#7c8294));font-size:10px;font-weight:700}
.bg-picker-day{aspect-ratio:1;min-width:0;display:grid;place-items:center;padding:0;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--tx,#1a1a2e);font:600 12px/1 inherit;cursor:pointer}
.bg-picker-day:hover:not(:disabled),.bg-picker-day:focus-visible{outline:0;border-color:color-mix(in srgb,var(--acc,#6c63ff) 50%,var(--brd,var(--br,#dfe1ea)));background:color-mix(in srgb,var(--acc,#6c63ff) 8%,var(--sur,#fff))}
.bg-picker-day.is-outside{color:var(--tx3,var(--tx2,#7c8294));opacity:.56}
.bg-picker-day.is-today{border-color:var(--acc,#6c63ff);color:var(--acc,#6c63ff)}
.bg-picker-day.is-selected{border-color:var(--acc,#6c63ff);background:var(--acc,#6c63ff);color:#fff;opacity:1}
.bg-picker-day:disabled,.bg-picker-month:disabled{opacity:.28;cursor:not-allowed;text-decoration:line-through}
.bg-picker-months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:3px 0 7px}
.bg-picker-month{min-height:42px;padding:8px 5px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:7px;background:var(--sur2,#f7f7fb);color:var(--tx,#1a1a2e);font:650 11px/1.2 inherit;cursor:pointer}
.bg-picker-month:hover:not(:disabled),.bg-picker-month:focus-visible{outline:0;border-color:var(--acc,#6c63ff);background:color-mix(in srgb,var(--acc,#6c63ff) 7%,var(--sur,#fff));color:var(--acc,#6c63ff)}
.bg-picker-month.is-current{box-shadow:inset 0 0 0 1px var(--acc,#6c63ff)}
.bg-picker-month.is-selected{border-color:var(--acc,#6c63ff);background:var(--acc,#6c63ff);color:#fff;box-shadow:none}
.bg-picker-time{display:grid;grid-template-columns:1fr 70px 8px 70px;align-items:center;gap:6px;margin-top:10px;padding:9px 0 2px;border-top:1px solid var(--brd,var(--br,#dfe1ea));font-size:12px;font-weight:700}
.bg-picker-time select{height:34px;padding:0 8px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:7px;background:var(--sur2,#f7f7fb);color:var(--tx,#1a1a2e);font:inherit}
.bg-picker-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--brd,var(--br,#dfe1ea))}
.bg-picker-action{min-height:34px;padding:7px 10px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:7px;background:var(--sur2,#f7f7fb);color:var(--tx2,var(--tx,#1a1a2e));font:700 11px/1 inherit;cursor:pointer}
.bg-picker-action:hover,.bg-picker-action:focus-visible{outline:0;border-color:var(--acc,#6c63ff);color:var(--acc,#6c63ff)}
.bg-picker-action.is-primary{border-color:var(--acc,#6c63ff);background:var(--acc,#6c63ff);color:#fff}

.bg-file-control>input[type="file"]{position:absolute!important;inset:0!important;z-index:3!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;opacity:0!important;cursor:pointer!important}
.bg-file-display{min-height:48px;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;padding:6px;border:1px solid var(--brd,var(--br,#dfe1ea));border-radius:8px;background:var(--sur2,#f7f7fb);color:var(--tx,#1a1a2e);transition:border-color .16s,background .16s}
.bg-file-control:hover .bg-file-display{border-color:var(--acc,#6c63ff);background:var(--sur,#fff)}
.bg-file-control>input:focus+.bg-file-display{border-color:var(--acc,#6c63ff);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#6c63ff) 14%,transparent)}
.bg-file-control>input:disabled+.bg-file-display{opacity:.58;cursor:not-allowed}
.bg-file-button{min-height:34px;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:6px;background:var(--acc,#6c63ff);color:#fff;font-size:12px;font-weight:700;white-space:nowrap}
.bg-upload-icon{position:relative;width:15px;height:15px;display:inline-block;border-bottom:1.5px solid currentColor}
.bg-upload-icon:before{content:"";position:absolute;left:7px;top:1px;height:10px;border-left:1.5px solid currentColor}
.bg-upload-icon:after{content:"";position:absolute;left:4px;top:1px;width:6px;height:6px;border-left:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg)}
.bg-file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--tx3,var(--tx2,#7c8294))}
.bg-file-name.has-file{color:var(--tx,#1a1a2e);font-weight:600}
.bg-file-control.is-dragging .bg-file-display{border-color:var(--acc,#6c63ff);background:color-mix(in srgb,var(--acc,#6c63ff) 9%,var(--sur,#fff))}
.bg-file-control.is-prominent .bg-file-display{min-height:76px;border-style:dashed;border-color:color-mix(in srgb,var(--acc,#6c63ff) 55%,var(--brd,var(--br,#dfe1ea)));background:color-mix(in srgb,var(--acc,#6c63ff) 4%,var(--sur2,#f7f7fb));padding:10px}
.bg-file-control.is-prominent .bg-file-button{min-height:40px;padding-inline:16px}
@media(max-width:520px){.bg-date-picker{padding:10px}.bg-file-display{grid-template-columns:1fr}.bg-file-button{justify-content:center}.bg-file-name{text-align:center;padding:2px 5px}}
