/* =========================================================
   LEADFORGE / forge.css
   Unified dark green-and-gold Dealage theme
   ========================================================= */

:root{
  /* Surfaces */
  --bg:#0b0d10;
  --bg-2:#11151a;
  --panel:#171c22;
  --panel-2:#1d242c;
  --panel-3:#24303a;
  --panel-4:#2d3945;

  /* Borders */
  --border:#2f3a46;
  --border-soft:#25303a;
  --border-strong:#3a4754;
  --border-hot:rgba(217,177,95,.30);

  /* Typography */
  --text:#eef2f6;
  --text-soft:#c9d1da;
  --text-dim:#8f9aa7;
  --text-faint:#6f7985;

  /* Brand */
  --lava:#4f7d3b;
  --lava-2:#7aa05b;
  --lava-3:#d9b15f;
  --lava-4:#e7d39f;
  --lava-soft:rgba(94,139,74,.14);
  --ember:#5f8a45;
  --ember-soft:rgba(94,139,74,.10);
  --gold:#d9b15f;

  /* States */
  --ok:#35d07f;
  --ok-soft:rgba(53,208,127,.10);
  --danger:#c78b4f;
  --danger-soft:rgba(255,100,100,.10);
  --warn:#d9b15f;
  --warn-soft:rgba(217,177,95,.10);
  --info:#6bb8ff;
  --info-soft:rgba(107,184,255,.10);

  /* Radius */
  --radius-xl:20px;
  --radius-lg:16px;
  --radius-md:12px;
  --radius-sm:10px;
  --radius-xs:8px;

  /* Shadow */
  --shadow-lg:0 28px 64px rgba(0,0,0,.42);
  --shadow-md:0 14px 32px rgba(0,0,0,.28);
  --shadow-sm:0 6px 16px rgba(0,0,0,.18);

  --lava-glow:
    0 0 0 1px rgba(217,177,95,.10),
    0 0 0 4px rgba(94,139,74,.05),
    0 10px 30px rgba(56,93,65,.24);
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html,
body{
  margin:0;
  padding:0;
  min-height:100%;
  background:
    radial-gradient(circle at 12% 0%, rgba(94,139,74,.10), transparent 18%),
    radial-gradient(circle at 90% 10%, rgba(217,177,95,.08), transparent 18%),
    radial-gradient(circle at 50% 100%, rgba(94,139,74,.06), transparent 24%),
    linear-gradient(180deg, #090b0d 0%, #0d1115 45%, #11171d 100%);
  color:var(--text);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.45;
}

body{
  position:relative;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.015), transparent 22%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,.006) 0 1px,
      transparent 1px 14px
    );
  opacity:.35;
}

img{
  max-width:100%;
  display:block;
}

a{
  color:var(--lava-3);
  text-decoration:none;
  transition:color .16s ease;
}

a:hover{
  color:#efe2bd;
}

button,
input,
select,
textarea{
  font:inherit;
}

/* =========================================================
   Global shell / base
   ========================================================= */

.wrap{
  width:min(1180px, calc(100% - 32px));
  margin:0 auto;
  padding:28px 0 56px;
  position:relative;
  z-index:1;
}

.lf-body{
  min-height:100vh;
}

.lf-app-shell{
  position:relative;
  min-height:100vh;
  overflow-x:hidden;
}

.lf-main{
  position:relative;
  z-index:2;
}

.lf-bg-glow{
  position:fixed;
  pointer-events:none;
  border-radius:999px;
  filter:blur(70px);
  opacity:.22;
  z-index:0;
}

.lf-bg-glow-1{
  top:-80px;
  left:-60px;
  width:280px;
  height:280px;
  background:radial-gradient(circle, rgba(94,139,74,.28) 0%, rgba(94,139,74,.10) 40%, transparent 72%);
}

.lf-bg-glow-2{
  top:120px;
  right:-100px;
  width:340px;
  height:340px;
  background:radial-gradient(circle, rgba(217,177,95,.20) 0%, rgba(94,139,74,.10) 45%, transparent 72%);
}

.lf-bg-grid{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.16;
  background:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.22), rgba(0,0,0,.7));
}

/* =========================================================
   Page hero / top bars
   ========================================================= */

.page-hero,
.top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  margin-bottom:22px;
}

.hero-copy{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(217,177,95,.18);
  background:linear-gradient(180deg, rgba(217,177,95,.14), rgba(94,139,74,.08));
  color:#e4c98d;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.09em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 18px rgba(94,139,74,.10);
}

.page-title,
.top h1{
  margin:0;
  color:#fbfcfd;
  font-size:34px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.04em;
  text-shadow:0 1px 0 rgba(255,255,255,.02);
}

.page-subtitle,
.sub{
  max-width:760px;
  color:var(--text-dim);
  font-size:14px;
  line-height:1.55;
  margin-top:6px;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* =========================================================
   Buttons
   ========================================================= */

.btn{
  --btn-bg:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  --btn-border:var(--border);
  --btn-color:var(--text);

  appearance:none;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:44px;
  padding:11px 16px;
  border-radius:12px;
  border:1px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-color);
  text-decoration:none !important;
  font-size:14px;
  font-weight:850;
  line-height:1;
  letter-spacing:.01em;
  cursor:pointer;
  user-select:none;
  overflow:hidden;
  isolation:isolate;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 8px 20px rgba(0,0,0,.22);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    filter .18s ease,
    background .18s ease,
    color .18s ease;
}

.btn::before{
  content:"";
  position:absolute;
  top:0;
  left:-140%;
  width:120%;
  height:100%;
  background:linear-gradient(
    115deg,
    transparent 0%,
    rgba(255,255,255,.00) 35%,
    rgba(255,255,255,.16) 50%,
    rgba(255,255,255,.00) 65%,
    transparent 100%
  );
  z-index:0;
  transition:left .7s ease;
  pointer-events:none;
}

.btn::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:11px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  z-index:0;
  pointer-events:none;
}

.btn > *{
  position:relative;
  z-index:1;
}

.btn:hover{
  transform:translateY(-2px);
}

.btn:hover::before{
  left:140%;
}

.btn:active{
  transform:translateY(0) scale(.985);
}

.btn:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 4px rgba(94,139,74,.16),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 24px rgba(0,0,0,.24);
}

.btn-primary,
.btn.primary{
  --btn-color:#fff;
  --btn-border:rgba(217,177,95,.26);
  --btn-bg:linear-gradient(180deg, var(--lava-3) 0%, var(--lava-2) 42%, var(--lava) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 24px rgba(56,93,65,.24),
    0 0 18px rgba(217,177,95,.12);
}

.btn-primary:hover,
.btn.primary:hover{
  filter:brightness(1.04);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 16px 28px rgba(56,93,65,.28),
    0 0 28px rgba(217,177,95,.14);
}

.btn-primary:active,
.btn.primary:active{
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.18),
    0 6px 12px rgba(56,93,65,.18);
}

.btn-secondary{
  --btn-color:var(--text);
  --btn-border:var(--border);
  --btn-bg:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015)), var(--panel);
}

.btn-secondary:hover{
  border-color:rgba(217,177,95,.24);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 12px 24px rgba(0,0,0,.24),
    0 0 18px rgba(94,139,74,.10);
  color:#fff;
}

.btn-danger{
  --btn-color:#fff;
  --btn-border:rgba(255,140,140,.18);
  --btn-bg:linear-gradient(180deg, #c8a15a 0%, #8f6a1f 100%);
}

.btn-danger:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 16px 28px rgba(239,68,68,.26);
}

.btn-sm{
  min-height:38px;
  padding:9px 12px;
  border-radius:10px;
  font-size:13px;
}

.btn-pill{
  border-radius:999px;
}

.btn-pulse{
  animation:brandPulse 2.2s ease-in-out infinite;
}

@keyframes brandPulse{
  0%,100%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 10px 24px rgba(56,93,65,.22),
      0 0 0 0 rgba(56,93,65,0);
  }
  50%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.20),
      0 14px 28px rgba(56,93,65,.26),
      0 0 0 8px rgba(217,177,95,.06);
  }
}

/* =========================================================
   Cards / panels
   ========================================================= */

.card{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.012));
  border:1px solid var(--border-soft);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.card:hover{
  transform:translateY(-2px);
  box-shadow:
    0 16px 36px rgba(0,0,0,.30),
    0 0 18px rgba(94,139,74,.08);
}

.card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(217,177,95,.28), transparent);
}

.card::after{
  content:"";
  position:absolute;
  inset:auto -40px -40px auto;
  width:180px;
  height:180px;
  background:radial-gradient(circle, rgba(94,139,74,.10), transparent 68%);
  pointer-events:none;
}

.card-header,
.head{
  padding:18px 20px 0;
  position:relative;
  z-index:1;
}

.card-body,
.body{
  padding:20px;
  position:relative;
  z-index:1;
}

.card-title,
.title{
  margin:0;
  color:#fff;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.02em;
}

.card-subtitle{
  margin-top:6px;
  color:var(--text-dim);
  font-size:13px;
  line-height:1.45;
}

.card-flat::after{
  display:none;
}

.head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 20px;
  border-bottom:1px solid var(--border-soft);
}

.tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  border-radius:999px;
  border:1px solid rgba(217,177,95,.18);
  background:rgba(217,177,95,.10);
  color:#e2c482;
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.info-box{
  background:linear-gradient(180deg, rgba(255,255,255,.022), rgba(255,255,255,.012));
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}

.info-label{
  color:#d59a7a;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
  margin-bottom:8px;
}

.info-value{
  color:#fff;
  font-size:14px;
  line-height:1.55;
  word-break:break-word;
}

.divider{
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent);
}

/* =========================================================
   Forms / inputs
   ========================================================= */

.form-grid,
.row{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
}

.row{
  margin-bottom:16px;
  align-items:start;
}

.full{
  grid-column:1 / -1;
}

.field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.label,
label{
  font-size:13px;
  font-weight:850;
  color:#e4eaf0;
  letter-spacing:.01em;
  display:block;
  margin-bottom:6px;
}

.help{
  color:var(--text-dim);
  font-size:12px;
  line-height:1.45;
}

.input,
.select,
.textarea,
input,
select,
textarea{
  width:100%;
  border-radius:12px;
  border:1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.012)),
    var(--panel-2);
  color:var(--text);
  padding:12px 13px;
  font-size:14px;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease, transform .16s ease;
}

.input::placeholder,
.textarea::placeholder,
input::placeholder,
textarea::placeholder{
  color:#7d8794;
}

.input:hover,
.select:hover,
.textarea:hover,
input:hover,
select:hover,
textarea:hover{
  border-color:var(--border-strong);
}

.input:focus,
.select:focus,
.textarea:focus,
input:focus,
select:focus,
textarea:focus{
  outline:none;
  border-color:rgba(94,139,74,.42);
  box-shadow:
    0 0 0 4px rgba(94,139,74,.10),
    0 0 24px rgba(94,139,74,.10);
  background:
    linear-gradient(180deg, rgba(94,139,74,.045), rgba(255,255,255,.015)),
    var(--panel-3);
}

.textarea,
textarea{
  min-height:130px;
  resize:vertical;
}

.input-inline{
  min-height:40px;
  padding:9px 11px;
  font-size:13px;
}

/* =========================================================
   Tables
   ========================================================= */

.table-shell{
  overflow:auto;
  border-radius:var(--radius-lg);
}

.table{
  width:100%;
  min-width:780px;
  border-collapse:separate;
  border-spacing:0;
}

.table thead th{
  text-align:left;
  padding:14px 16px;
  background:linear-gradient(180deg, rgba(94,139,74,.07), rgba(255,255,255,.018));
  border-bottom:1px solid var(--border);
  color:#d59a7a;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:900;
  white-space:nowrap;
}

.table tbody td{
  padding:15px 16px;
  border-bottom:1px solid var(--border-soft);
  vertical-align:middle;
}

.table tbody tr{
  transition:background .14s ease;
}

.table tbody tr:hover{
  background:linear-gradient(90deg, rgba(217,177,95,.035), rgba(255,255,255,.015));
}

.table-title{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.table-main{
  color:#fff;
  font-size:14px;
  font-weight:900;
}

.table-sub{
  font-size:12px;
  color:var(--text-dim);
}

.money{
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

.actions-col{
  white-space:nowrap;
}

/* =========================================================
   Badges / pills / calculator statuses
   ========================================================= */

.badge,
.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:850;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text-soft);
  text-transform:capitalize;
}

.badge.draft{
  color:#d1d7df;
  border-color:#39414d;
  background:rgba(255,255,255,.04);
}

.badge.sent,
.badge.active{
  color:#a4f1c0;
  border-color:rgba(53,208,127,.22);
  background:rgba(53,208,127,.09);
}

.badge.dead{
  color:#e3c98e;
  border-color:rgba(255,100,100,.22);
  background:rgba(255,100,100,.08);
}

.badge.warn{
  color:#e7d39f;
  border-color:rgba(255,179,71,.22);
  background:rgba(255,179,71,.09);
}

.badge.info{
  color:#b9dcff;
  border-color:rgba(107,184,255,.22);
  background:rgba(107,184,255,.09);
}

.pill{
  font-size:11px;
  padding:5px 9px;
  color:var(--text-dim);
  background:rgba(255,255,255,.025);
  text-transform:none;
}

/* Calculator result statuses */
.statusLine{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

.status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  padding:4px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  border:1px solid transparent;
  text-transform:uppercase;
}

.status.good{
  color:#a4f1c0;
  background:rgba(53,208,127,.10);
  border-color:rgba(53,208,127,.18);
}

.status.warn{
  color:#e7d39f;
  background:rgba(217,177,95,.10);
  border-color:rgba(217,177,95,.18);
}

.status.bad{
  color:#e3c98e;
  background:rgba(255,100,100,.10);
  border-color:rgba(255,100,100,.18);
}

/* =========================================================
   Stats
   ========================================================= */

.stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}

.stat{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.01));
  border:1px solid var(--border-soft);
  border-radius:15px;
  padding:16px;
  box-shadow:var(--shadow-sm);
}

.stat::after{
  content:"";
  position:absolute;
  inset:auto auto 0 0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg, var(--ember), var(--lava-2), transparent 80%);
  opacity:.7;
}

.stat-label{
  color:var(--text-dim);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:900;
}

.stat-value{
  margin-top:8px;
  font-size:24px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-.03em;
  color:#fff;
}

/* =========================================================
   Helpers / stacks / grids
   ========================================================= */

.stack-8 > * + *{ margin-top:8px; }
.stack-12 > * + *{ margin-top:12px; }
.stack-16 > * + *{ margin-top:16px; }
.stack-20 > * + *{ margin-top:20px; }
.stack-24 > * + *{ margin-top:24px; }

.row-actions,
.share-actions,
.hero-actions,
.actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.actions{
  margin-top:6px;
}

.grid,
.grid-3{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:22px;
}

.grid-2{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
}

.grid-4{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:14px;
}

.mt-8{ margin-top:8px; }
.mt-12{ margin-top:12px; }
.mt-16{ margin-top:16px; }
.mt-20{ margin-top:20px; }
.mt-24{ margin-top:24px; }

.muted{ color:var(--text-dim); }
.right{ margin-left:auto; }

/* =========================================================
   Deal layout
   ========================================================= */

.deal-shell{
  display:grid;
  grid-template-columns:minmax(0, 1.45fr) minmax(300px, .85fr);
  gap:16px;
}

.side-panel{
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* =========================================================
   Lead page utilities
   ========================================================= */

.toolbar{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.filter-bar{
  display:grid;
  grid-template-columns:220px 1fr auto;
  gap:12px;
  align-items:end;
}

.lead-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.lead-card{
  display:grid;
  grid-template-columns:minmax(220px,1.2fr) minmax(170px,.9fr) minmax(220px,1.2fr) minmax(220px,1.2fr) auto;
  gap:14px;
  align-items:start;
  padding:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.012));
  border:1px solid var(--border-soft);
  border-radius:16px;
  box-shadow:var(--shadow-sm);
  position:relative;
  overflow:hidden;
}

.lead-card::after{
  content:"";
  position:absolute;
  inset:auto auto 0 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(217,177,95,.18), transparent 45%);
}

.lead-block{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.lead-name{
  color:#fff;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.02em;
}

.lead-meta{
  color:var(--text-dim);
  font-size:13px;
}

.lead-address{
  color:#fff;
  font-size:15px;
  font-weight:800;
}

.lead-city{
  color:var(--text-dim);
  font-size:13px;
}

.quick-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.inline-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.inline-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

/* =========================================================
   Calculator results / summaries
   ========================================================= */

.result{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--border-soft);
  font-size:14px;
}

.summary{
  font-weight:700;
  margin-bottom:6px;
  color:#fff;
}

.result ul{
  margin:6px 0 0 18px;
  padding:0;
}

.result li{
  margin-bottom:4px;
  color:var(--text-soft);
}

/* =========================================================
   Empty states
   ========================================================= */

.empty{
  padding:34px 20px;
  text-align:center;
  color:var(--text-dim);
}

.empty-title{
  margin:0 0 6px;
  color:#fff;
  font-size:18px;
  font-weight:900;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 1080px){
  .lead-card{
    grid-template-columns:1fr 1fr;
  }

  .filter-bar{
    grid-template-columns:1fr 1fr;
  }

  .filter-bar > *:last-child{
    grid-column:1 / -1;
  }
}

@media (max-width: 980px){
  .stats{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }

  .deal-shell{
    grid-template-columns:1fr;
  }

  .grid,
  .grid-3{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  .wrap{
    width:min(100% - 20px, 1180px);
    padding:22px 0 42px;
  }

  .page-title,
  .top h1{
    font-size:26px;
  }

  .form-grid,
  .row,
  .stats,
  .grid-2,
  .grid-3,
  .grid-4,
  .filter-bar,
  .inline-grid,
  .lead-card{
    grid-template-columns:1fr;
  }

  .hero-actions,
  .row-actions,
  .share-actions,
  .toolbar,
  .quick-actions,
  .actions{
    width:100%;
  }

  .hero-actions .btn,
  .row-actions .btn,
  .share-actions .btn,
  .toolbar .btn,
  .quick-actions .btn,
  .actions .btn{
    flex:1 1 100%;
  }

  .table{
    min-width:680px;
  }
}