/* All geometry rules are R12-scoped. Official shell remains unchanged. */

body[data-r4-view="grazing"] #r3bRouteHost{height:calc(100dvh - 82px);overflow:hidden;padding:0}

.g12{height:100%;min-height:0;display:grid;grid-template-rows:auto auto 96px minmax(220px,1.25fr) minmax(180px,1fr) auto;gap:12px;color:#193951;font-family:Arial,Helvetica,sans-serif;padding:10px 14px;box-sizing:border-box;background:#f4f8fa}.g12 h1{font-size:26px;margin:0;color:#123751}.g12 p{margin:5px 0;font-size:12px;color:#687c8e}.g12-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.g12-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end}.g12 label{font-size:12px;display:grid;gap:5px}.g12 select,.g12 button,.g12-dialog button,.g12-dialog select,.g12-dialog input,.g12-dialog textarea{font:inherit;border:1px solid #dfe8ee;border-radius:5px;padding:8px 10px;background:white;color:#24465d}.g12 button,.g12-dialog button{cursor:pointer}.g12 button:hover,.g12-dialog button:hover{border-color:#079658;background:#f0fbf5}.g12 .g12-primary,.g12-dialog .g12-primary{background:#087443;color:white;border-color:#087443}.g12-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.g12-kpi{display:flex;align-items:center;text-align:left;gap:10px;padding:13px!important;min-width:0}.g12-kpi span{display:grid;gap:5px;font-size:12px}.g12-kpi strong{font-size:23px;color:#103449}.g12-kpi small{font-size:10px;color:#388b65}.g12-kpi img{width:42px;height:42px;object-fit:contain;flex-shrink:0}.g12-middle{display:grid;grid-template-columns:1.8fr 1fr;gap:12px;min-height:0}.g12-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;min-height:0}.g12-card{background:white;border:1px solid #e2ebf1;border-radius:8px;padding:10px;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}.g12-card header{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px;min-height:30px}.g12-card header button{padding:5px;font-size:10px;white-space:nowrap}.g12-card .g12-title{font-size:14px;font-weight:bold;border:0;padding:0;background:none;text-align:left;white-space:normal}.g12-scroll{overflow:auto;max-height:210px;min-height:0}.g12 table,.g12-dialog table{width:100%;border-collapse:collapse;font-size:11px;text-align:left;table-layout:fixed}.g12 th,.g12-dialog th{height:30px;box-sizing:border-box;background:#f2f7fa;color:#587084;font-size:10px;position:sticky;top:0;padding:4px;z-index:1}.g12 td,.g12-dialog td{height:36px;box-sizing:border-box;border-bottom:1px solid #eef3f6;padding:4px;overflow:hidden;text-overflow:ellipsis}.g12 td button{font-size:10px;padding:2px 3px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.g12-bars{overflow:auto;max-height:210px}.g12-bars button{display:grid;grid-template-columns:1fr 1.2fr auto;gap:8px;align-items:center;width:100%;border:0;height:38px;font-size:11px;text-align:left}.g12 progress{width:100%;height:10px;accent-color:#14bb73}.g12-foot{font-size:10px!important}.g12-dialog{width:min(860px,calc(100vw - 48px));max-height:calc(100dvh - 48px);border:1px solid #dce8e0;border-radius:12px;padding:0;color:#193951;box-shadow:0 16px 60px #1235}.g12-dialog::backdrop{background:#0c263b66}.g12-dialog>header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #e2ebf1}.g12-dialog h2{margin:0;font-size:21px}.g12-dialog-body{padding:18px;max-height:calc(100dvh - 150px);overflow:auto;box-sizing:border-box}.g12-dialog .g12-scroll{max-height:210px}.g12-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.g12-form label{display:grid;gap:6px;font-size:13px}.g12-form fieldset,.g12-form footer,.g12-form [role="alert"]{grid-column:1/-1}.g12-form fieldset{border:1px solid #dfe8ee;border-radius:6px}.g12-form textarea{min-height:70px}.g12-form footer,.g12-dialog footer{display:flex;justify-content:flex-end;gap:10px;padding-top:12px}.g12-animals{max-height:170px;overflow:auto;display:grid;grid-template-columns:repeat(3,1fr)}.g12-animals label{display:flex;align-items:center}.g12-form [role="alert"]{color:#b42318}.g12-dialog [type="checkbox"]{width:16px;height:16px}.g12 button:focus-visible,.g12-dialog button:focus-visible{outline:2px solid #067a46;outline-offset:2px}



/* R12 Ganadero: viewport geometry + readable five-row lists; scoped only to grazing. */

body[data-r4-view="grazing"] #r3bRouteHost{

  height:var(--g12-host-height,calc(100dvh - 82px));

  min-height:0;max-height:100dvh;overflow:hidden;padding:0;

}

body[data-r4-view="grazing"] .g12{

  height:100%;min-height:0;overflow:hidden;padding:8px 12px;

  gap:8px;font-family:inherit;

  grid-template-rows:minmax(42px,auto) minmax(52px,auto) 82px minmax(0,1.18fr) minmax(0,1fr) minmax(12px,auto);

}

body[data-r4-view="grazing"] .g12-heading h1{font-size:24px;line-height:1.15}

body[data-r4-view="grazing"] .g12-heading p{font-size:12px;margin:3px 0 0}

body[data-r4-view="grazing"] .g12-kpi{

 position:relative;min-height:0;min-width:0;padding:9px 10px!important;

 border-radius:8px;text-align:left;box-shadow:none;overflow:hidden;

}

body[data-r4-view="grazing"] .g12-kpi img{width:39px;height:39px;flex-shrink:0}

body[data-r4-view="grazing"] .g12-kpi span:not(.g12-kpi-arrow){font-size:12px;min-width:0;line-height:1.2}

body[data-r4-view="grazing"] .g12-kpi strong{font-size:21px;white-space:normal;line-height:1.1}

body[data-r4-view="grazing"] .g12-kpi small{font-size:11px}

body[data-r4-view="grazing"] .g12-kpi .g12-kpi-arrow{

 margin-left:auto;color:#1165a8;font-size:22px;line-height:1;align-self:center;

}

body[data-r4-view="grazing"] .g12-middle,

body[data-r4-view="grazing"] .g12-bottom{min-height:0;gap:8px}

body[data-r4-view="grazing"] .g12-middle{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}

body[data-r4-view="grazing"] .g12-card{min-height:0;padding:9px;overflow:hidden}

body[data-r4-view="grazing"] .g12-card header{min-height:28px;margin-bottom:5px}

body[data-r4-view="grazing"] .g12-card .g12-title{font-size:14px;color:#123751}

body[data-r4-view="grazing"] .g12-card header button:not(.g12-title){font-size:11px;padding:5px 7px}

body[data-r4-view="grazing"] .g12-scroll{

 flex:1 1 auto;min-height:0;width:100%;max-height:210px;

 overflow:auto;scrollbar-gutter:stable;outline-offset:-2px;

}

body[data-r4-view="grazing"] .g12 table,

.g12-dialog table{table-layout:auto;font-size:12px}

body[data-r4-view="grazing"] .g12-scroll table{min-width:100%}

body[data-r4-view="grazing"] .g12-cols-8 table{min-width:745px}

body[data-r4-view="grazing"] .g12-cols-6 table{min-width:670px}

body[data-r4-view="grazing"] .g12-cols-4 table{min-width:470px}

body[data-r4-view="grazing"] .g12 th,.g12-dialog th{

 font-size:11px;line-height:1.2;padding:5px 7px;height:30px;white-space:normal

}

body[data-r4-view="grazing"] .g12 td,.g12-dialog td{

 font-size:12px;line-height:1.2;padding:6px 7px;height:36px;

 overflow:visible;text-overflow:clip;white-space:nowrap

}

body[data-r4-view="grazing"] .g12 td button{font-size:11px;padding:3px 6px}

body[data-r4-view="grazing"] .g12-bars{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;scrollbar-gutter:stable}

body[data-r4-view="grazing"] .g12-bars button{height:37px;font-size:12px;min-width:0}

body[data-r4-view="grazing"] .g12-foot{font-size:10px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}

.g12-dialog{width:min(880px,calc(100vw - 40px));max-height:calc(100dvh - 40px)}

.g12-dialog .g12-dialog-body{max-height:calc(100dvh - 125px);overflow:auto}

.g12-dialog .g12-scroll{max-height:210px;overflow:auto;scrollbar-gutter:stable}

.g12-dialog .g12-cols-6 table{min-width:740px}

.g12-dialog .g12-cols-8 table{min-width:820px}

.g12-dialog .g12-cols-4 table{min-width:590px}

.g12-dialog td{white-space:normal;overflow-wrap:anywhere}

.g12-dialog h2{font-size:20px}

.g12-dialog .g12-form label{font-size:13px}

@media(max-height:720px){

 body[data-r4-view="grazing"] .g12{gap:6px;padding:6px 10px;grid-template-rows:40px 50px 72px minmax(0,1.15fr) minmax(0,1fr) 12px}

 body[data-r4-view="grazing"] .g12-kpi{padding:6px 8px!important}

 body[data-r4-view="grazing"] .g12-kpi img{height:31px;width:31px}

 body[data-r4-view="grazing"] .g12-kpi strong{font-size:19px}

}



/* R12 Ganadero: entire information panel opens its existing detail, except nested actions. */

body[data-r4-view="grazing"] .g12-card[data-card-detail]{cursor:pointer}

body[data-r4-view="grazing"] .g12-card[data-card-detail]:focus-visible{

 outline:2px solid #067a46;outline-offset:-2px;

}

body[data-r4-view="grazing"] .g12-card[data-card-detail] :is(button,a,input,select,textarea){cursor:pointer}



/* R12 VISUAL FIDELITY / Ganadero only. Reference: approved 1672x941 dashboard.

   No global shell selectors, no body style changes, no database assumptions. */

body[data-r4-view="grazing"] .g12{

  --g12-navy:#08257f;--g12-body:#1c3981;--g12-green:#00ab6b;

  --g12-line:#dce6f3;--g12-light:#f7fbff;--g12-muted:#56709c;

  display:grid;grid-template-columns:minmax(0,1fr);

  grid-template-rows:clamp(78px,11.5vh,110px) clamp(92px,12vh,116px) minmax(0,1.32fr) minmax(0,1fr) 14px;

  gap:clamp(7px,1.15vh,13px);padding:12px 14px 7px;

  color:var(--g12-body);background:#f4f8ff;

}

body[data-r4-view="grazing"] .g12-toolbar{

 display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.75fr);

 gap:18px;min-height:0;align-items:center;

}

body[data-r4-view="grazing"] .g12-heading{

 display:flex;flex-direction:column;align-items:flex-start;justify-content:center;

 gap:5px;min-width:0;position:relative;

}

body[data-r4-view="grazing"] .g12-heading h1{

 font-size:clamp(24px,2.4vw,34px);line-height:1.12;font-weight:800;

 color:var(--g12-navy);letter-spacing:-.6px;white-space:nowrap;

}

body[data-r4-view="grazing"] .g12-heading p{font-size:clamp(11px,.93vw,15px);color:#315db4;line-height:1.3;margin:0}

body[data-r4-view="grazing"] .g12-heading .g12-primary{position:absolute;right:0;top:100%;z-index:2;padding:5px 9px;font-size:11px;box-shadow:0 1px 3px #cbd9eb}

body[data-r4-view="grazing"] .g12-filters{

 display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;

 gap:7px;align-items:center;min-width:0;

}

body[data-r4-view="grazing"] .g12-filters label{font-size:11px;font-weight:600;color:#173b8c;min-width:0;gap:4px}

body[data-r4-view="grazing"] .g12-filters select{

 width:100%;min-width:0;max-width:100%;height:38px;

 font-size:12px;font-weight:600;color:var(--g12-navy);border-radius:7px;

 border-color:var(--g12-line);background:#fff;padding:6px 22px 6px 8px;

}

body[data-r4-view="grazing"] .g12-filters [data-clear]{

 align-self:end;height:38px;white-space:nowrap;font-size:11px;

 border:1px solid var(--g12-line);color:var(--g12-navy);padding:6px 8px;

}

body[data-r4-view="grazing"] .g12-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(7px,.85vw,14px);min-height:0}

body[data-r4-view="grazing"] .g12-kpi{

 border:1px solid var(--g12-line);border-radius:10px;background:#fff;

 box-shadow:0 1px 2px #d4e1f055;

 display:flex;align-items:center;gap:12px;padding:clamp(7px,.85vw,14px)!important;

 height:100%;

}

body[data-r4-view="grazing"] .g12-kpi img{width:clamp(42px,3.7vw,62px);height:clamp(43px,4.1vw,64px);object-fit:contain}

body[data-r4-view="grazing"] .g12-kpi span:not(.g12-kpi-arrow){font-size:clamp(11px,.92vw,15px);line-height:1.24;display:grid;gap:4px;color:#124093}

body[data-r4-view="grazing"] .g12-kpi strong{font-size:clamp(22px,2vw,29px);color:#071d7a;line-height:1.05;font-weight:800}

body[data-r4-view="grazing"] .g12-kpi small{font-size:clamp(10px,.78vw,12px);color:#00a462;font-weight:700;line-height:1.15}

body[data-r4-view="grazing"] .g12-kpi .g12-kpi-arrow{display:none}

body[data-r4-view="grazing"] .g12-middle{grid-template-columns:minmax(0,1.72fr) minmax(0,1fr);gap:clamp(7px,1vw,16px)}

body[data-r4-view="grazing"] .g12-bottom{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(7px,1vw,16px)}

body[data-r4-view="grazing"] .g12-card{

 background:#fff;border:1px solid var(--g12-line);border-radius:10px;

 box-shadow:0 1px 2px #e4edf6a8;overflow:hidden;padding:clamp(8px,1vw,14px);

}

body[data-r4-view="grazing"] .g12-card>header{min-height:32px;margin:0 0 10px;gap:8px;flex-shrink:0}

body[data-r4-view="grazing"] .g12-card>header::before{

 content:'';display:block;flex:0 0 28px;width:28px;height:28px;

 background-repeat:no-repeat;background-position:center;background-size:contain;

}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"]>header::before{background-image:url('/r4/grazing-r12-icons/sec-periods.png')}

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"]>header::before{background-image:url('/r4/grazing-r12-icons/sec-events.png')}

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"]>header::before{background-image:url('/r4/grazing-r12-icons/sec-reviews.png')}

body[data-r4-view="grazing"] .g12-card[data-card-detail="occupancy"]>header::before{background-image:url('/r4/grazing-r12-icons/sec-occupancy.png')}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"]>header::before{background-image:url('/r4/grazing-r12-icons/sec-supplement.png')}

body[data-r4-view="grazing"] .g12-card .g12-title{

 font-size:clamp(13px,1.18vw,20px);font-weight:800;color:var(--g12-navy);

 line-height:1.15;flex:1 1 auto;min-width:0;

}

body[data-r4-view="grazing"] .g12-card header button:not(.g12-title){

 border:1px solid var(--g12-line);background:white;border-radius:6px;

 color:var(--g12-navy);font-size:clamp(10px,.75vw,12px);

 padding:6px 9px;white-space:nowrap;

}

body[data-r4-view="grazing"] .g12-card header button[data-action="event"]{

 color:var(--g12-navy);font-weight:600;

}

body[data-r4-view="grazing"] .g12-card header button[data-action="event"]::before{content:'+';font-size:18px;margin-right:7px}

body[data-r4-view="grazing"] .g12-scroll{

 flex:1 1 auto;min-height:0;max-height:none;width:100%;

 overflow-x:hidden;overflow-y:auto;scrollbar-gutter:auto;

}

body[data-r4-view="grazing"] .g12 table{width:100%;min-width:0!important;table-layout:fixed;color:var(--g12-body);font-size:clamp(11px,.86vw,13px)}

body[data-r4-view="grazing"] .g12 th{height:34px;font-size:clamp(10px,.77vw,12px);font-weight:700;color:#254b91;background:#edf5fd;border-bottom:1px solid var(--g12-line);padding:5px}

body[data-r4-view="grazing"] .g12 td{height:clamp(30px,3.7vh,38px);font-size:clamp(10px,.82vw,13px);color:#233f83;padding:5px;white-space:normal;overflow-wrap:break-word;line-height:1.2}

body[data-r4-view="grazing"] .g12-cols-8 th:nth-child(4),body[data-r4-view="grazing"] .g12-cols-8 td:nth-child(4){width:13%}

body[data-r4-view="grazing"] .g12-cols-8 th:nth-child(6),body[data-r4-view="grazing"] .g12-cols-8 td:nth-child(6){width:16%}

body[data-r4-view="grazing"] .g12-cols-8 th:last-child,body[data-r4-view="grazing"] .g12-cols-8 td:last-child{width:10%}

body[data-r4-view="grazing"] .g12-cols-5 th:nth-child(4),body[data-r4-view="grazing"] .g12-cols-5 td:nth-child(4){width:32%}

body[data-r4-view="grazing"] .g12 td button{font-size:clamp(10px,.72vw,12px);padding:4px 6px;color:#214b9f}

body[data-r4-view="grazing"] .g12-state{display:inline-flex;justify-content:center;align-items:center;min-height:22px;border-radius:6px;padding:2px 7px;white-space:nowrap;font-size:11px;font-weight:700}

body[data-r4-view="grazing"] .g12-state-active{background:#d6f8e6;color:#00976d}

body[data-r4-view="grazing"] .g12-state-rest{background:#fff2c9;color:#cd8100}

body[data-r4-view="grazing"] .g12-state-recorded{background:#e4f4ff;color:#1e76a6}

body[data-r4-view="grazing"] .g12-bars{max-height:none;overflow-y:auto;overflow-x:hidden}

body[data-r4-view="grazing"] .g12-bars button{height:clamp(30px,4.5vh,42px);font-size:clamp(11px,.87vw,13px);color:#23468c;gap:8px}

body[data-r4-view="grazing"] .g12-bars progress{height:14px;accent-color:#0bbb74;border-radius:4px}

body[data-r4-view="grazing"] .g12-foot{font-size:10px!important;color:#6580a7}

body[data-r4-view="grazing"] .g12-card[data-card-detail]:hover{border-color:#9ccab9;background:#fdfffe}

body[data-r4-view="grazing"] .g12-card[data-card-detail]:focus-visible{outline:2px solid #1b9c65;outline-offset:-3px}

.g12-dialog h2{color:#0d257c}

.g12-dialog{border-color:#d9e5f2;box-shadow:0 20px 65px #08163f3d}

.g12-dialog th{color:#254b91;background:#edf5fd}

@media(max-width:1350px){

 body[data-r4-view="grazing"] .g12-toolbar{grid-template-columns:minmax(250px,.8fr) minmax(0,1.8fr);gap:8px}

 body[data-r4-view="grazing"] .g12-filters{gap:4px}

 body[data-r4-view="grazing"] .g12-heading h1{font-size:24px}

 body[data-r4-view="grazing"] .g12-heading p{font-size:11px}

 body[data-r4-view="grazing"] .g12-kpi{gap:5px}

 body[data-r4-view="grazing"] .g12-kpi img{height:43px;width:43px}

 body[data-r4-view="grazing"] .g12-kpi span:not(.g12-kpi-arrow){font-size:11px}

 body[data-r4-view="grazing"] .g12-kpi strong{font-size:22px}

 body[data-r4-view="grazing"] .g12-card>header::before{flex-basis:22px;width:22px;height:22px}

 body[data-r4-view="grazing"] .g12-card .g12-title{font-size:13px}

}

@media(max-height:710px){

 body[data-r4-view="grazing"] .g12{gap:6px;padding:7px 10px 4px;grid-template-rows:76px 83px minmax(0,1.35fr) minmax(0,1fr) 13px}

 body[data-r4-view="grazing"] .g12-card{padding:7px}

 body[data-r4-view="grazing"] .g12-card>header{margin-bottom:5px}

}





/* R12 UI P2 -- precision corrections: compact table dates + intact KPI icon tiles.

   Scope is R12 BODY only; official shell and global tokens remain frozen. */

body[data-r4-view="grazing"] .g12-kpi {

  display:grid!important;

  grid-template-columns:clamp(48px,3.8vw,64px) minmax(0,1fr);

  align-items:center;

  column-gap:clamp(7px,.7vw,12px);

  overflow:hidden;

}

body[data-r4-view="grazing"] .g12-kpi > img {

  display:block;

  width:100%!important;

  height:auto!important;

  max-height:66px;

  aspect-ratio:1 / 1;

  object-fit:contain;

  object-position:center;

  flex:none;

  background:transparent;

  position:relative;

  z-index:1;

}

body[data-r4-view="grazing"] .g12-kpi > span:not(.g12-kpi-arrow) {

  min-width:0;

  width:100%;

  overflow-wrap:normal;

  word-break:normal;

  position:relative;

  z-index:0;

  background:transparent;

}

body[data-r4-view="grazing"] .g12-kpi[data-detail="reviews"] strong {

  font-size:clamp(16px,1.25vw,21px);

  line-height:1.1;

  white-space:nowrap;

  font-variant-numeric:tabular-nums;

}

body[data-r4-view="grazing"] .g12-scroll time {

  display:inline-block;

  white-space:nowrap;

  word-break:keep-all;

  overflow-wrap:normal;

  font-size:clamp(10px,.78vw,12px);

  font-variant-numeric:tabular-nums;

}

body[data-r4-view="grazing"] .g12-scroll th,

body[data-r4-view="grazing"] .g12-scroll td {

  overflow-wrap:normal;

  word-break:normal;

}

/* The five-column novelties panel previously gave Fecha too little width. */

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 th:nth-child(1),

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 td:nth-child(1) {width:20%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 th:nth-child(2),

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 td:nth-child(2) {width:16%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 th:nth-child(3),

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 td:nth-child(3) {width:20%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 th:nth-child(4),

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 td:nth-child(4) {width:29%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 th:nth-child(5),

body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] .g12-cols-5 td:nth-child(5) {width:15%}

/* Reviews: date minimum space without taking space from the review status. */

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 th:nth-child(1),

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 td:nth-child(1) {width:33%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 th:nth-child(2),

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 td:nth-child(2) {width:29%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 th:nth-child(3),

body[data-r4-view="grazing"] .g12-card[data-card-detail="reviews"] .g12-cols-3 td:nth-child(3) {width:38%}

/* Eight-column active periods: protect potrero and both dates from letter wrapping. */

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(1){width:10%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(2){width:18%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(3){width:9%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(4){width:14%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(5){width:8%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(6){width:14%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(7){width:17%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="periods"] .g12-cols-8 :is(th,td):nth-child(8){width:10%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] .g12-cols-4 :is(th,td):nth-child(1){width:25%;white-space:nowrap}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] .g12-cols-4 :is(th,td):nth-child(2){width:20%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] .g12-cols-4 :is(th,td):nth-child(3){width:23%}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] .g12-cols-4 :is(th,td):nth-child(4){width:32%}



/* AGX_R12_START_BUTTON_TOOLBAR_R2_BEGIN */

/* CTA lives in the upper-right of the R12 toolbar, directly above the filters. */

body[data-r4-view="grazing"] .g12-toolbar {

  grid-template-rows: minmax(36px, auto) minmax(51px, 1fr);

  row-gap: 2px;

  align-items: stretch;

}

body[data-r4-view="grazing"] .g12-toolbar > .g12-heading {

  grid-column: 1;

  grid-row: 1 / 3;

  align-self: center;

}

body[data-r4-view="grazing"] .g12-toolbar > .g12-toolbar-actions {

  grid-column: 2;

  grid-row: 1;

  justify-self: end;

  align-self: center;

  display: flex;

  align-items: center;

  justify-content: flex-end;

  min-width: 0;

}

body[data-r4-view="grazing"] .g12-toolbar > .g12-filters {

  grid-column: 2;

  grid-row: 2;

  align-self: end;

  align-items: end;

}

body[data-r4-view="grazing"] .g12-toolbar-actions > .g12-start-action {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  min-width: 176px;

  min-height: 36px;

  padding: 8px 15px;

  border: 1px solid var(--g12-green, #00ab6b);

  border-radius: 7px;

  background: var(--g12-green, #00ab6b);

  color: #fff;

  font-size: 13px;

  line-height: 1.1;

  font-weight: 700;

  white-space: nowrap;

  box-shadow: 0 2px 6px rgba(0, 89, 51, .18);

}

body[data-r4-view="grazing"] .g12-toolbar-actions > .g12-start-action:hover {

  background: #008c58;

  border-color: #008c58;

  color: #fff;

}

body[data-r4-view="grazing"] .g12-toolbar-actions > .g12-start-action:focus-visible {

  outline: 3px solid #2b64c4;

  outline-offset: 2px;

}

body[data-r4-view="grazing"] .g12-toolbar-actions .g12-start-plus {

  color: inherit;

  display: inline-block;

  font-size: 19px;

  font-weight: 700;

  line-height: .9;

}

/* END AGX_R12_START_BUTTON_TOOLBAR_R2 */



/* R12 authorized integration: dedicated icon cells and action hierarchy. */

body[data-r4-view="grazing"] .g12-card>header{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center}

body[data-r4-view="grazing"] .g12-card>header::before{width:28px;height:28px;min-width:28px;grid-column:1}

body[data-r4-view="grazing"] .g12-card .g12-title{grid-column:2;overflow-wrap:normal}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"]>header{grid-template-columns:28px minmax(0,1fr)}

body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"]>header>[data-action]{grid-column:2;justify-self:start}

body[data-r4-view="grazing"] .g12-card header button:not(.g12-title),

body[data-r4-view="grazing"] .g12 button[data-period],

.g12-dialog button:not([data-close]):not([data-cancel]){background:#087443;color:#fff;border-color:#087443}

body[data-r4-view="grazing"] .g12-card header button:not(.g12-title):hover,

body[data-r4-view="grazing"] .g12 button[data-period]:hover,

.g12-dialog button:not([data-close]):not([data-cancel]):hover{background:#065c35;color:#fff}

.g12-dialog button[data-close],.g12-dialog button[data-cancel]{background:#fff;color:#087443;border:1px solid #087443}

.g12-dialog button[data-close]:hover,.g12-dialog button[data-cancel]:hover{background:#effaf3;color:#065c35}

.g12-dialog button:disabled{opacity:.55;cursor:not-allowed}

.g12-dialog .g12-wide{grid-column:1/-1}

.g12-dialog [data-sources]{max-height:180px;overflow:auto;display:grid;gap:10px}

body[data-r4-view="grazing"] .g12-scroll{max-height:210px}



#r60h-body .r12-today-scroll{max-height:242px;overflow:auto}

#r60h-body .r12-today-scroll tbody tr{height:42px}

#r60h-body .r12-today-open{background:#087443;color:white;border:1px solid #087443;border-radius:5px;padding:5px 8px;cursor:pointer}

#r60h-body .r12-today-open:focus-visible{outline:2px solid #123751;outline-offset:2px}



/* AGX_R12_GANADERO_MODAL_HEADERS_CSS_R1_BEGIN */
/* Target only R12 cards. Do not adjust global shell geometry or browser scroll. */
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
  min-width: 0;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header::before,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header::before {
  content: "";
  display: block;
  flex: 0 0 30px;
  width: 30px;
  min-width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  position: static;
  opacity: 1;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header .g12-title,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header .g12-title {
  display: block;
  min-width: 0;
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  background: transparent;
  position: static;
  z-index: auto;
  line-height: 1.2;
  text-align: left;
}
/* Protect the Animal column in the period-detail popup.
   Three-column tables also occur elsewhere, so keep table width fully available. */
.g12-dialog .g12-cols-3 table { width: 100%; table-layout: auto; min-width: 0; }
.g12-dialog .g12-cols-3 :is(th, td):first-child {
  width: 30%;
  min-width: 145px;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  font-variant-numeric: tabular-nums;
}
.g12-dialog .g12-cols-3 :is(th, td):nth-child(2) { width: 35%; }
.g12-dialog .g12-cols-3 :is(th, td):nth-child(3) { width: 35%; }
/* Keep dialog chrome and actions visible, let the dialog body scroll.
   Use open state so a closed native dialog remains hidden. */
.g12-dialog[open] {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: calc(100dvh - 36px);
}
.g12-dialog[open] > header { flex: 0 0 auto; }
.g12-dialog[open] > .g12-dialog-body {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: 12px;
}
.g12-dialog[open] .g12-form footer {
  position: sticky;
  bottom: -12px;
  z-index: 3;
  background: #fff;
  padding: 12px 0 5px;
  border-top: 1px solid #e2ebf1;
}
/* R12 modal control palette. Cancel and Close remain white/green. */
.g12-dialog .g12-form [type="submit"].g12-primary {
  background: #087443;
  border-color: #087443;
  color: #fff;
}
.g12-dialog .g12-form [data-cancel],
.g12-dialog > header [data-close] {
  background: #fff;
  color: #087443;
  border-color: #087443;
}
/* AGX_R12_GANADERO_MODAL_HEADERS_CSS_R1_END */

/* AGX_R12_GANADERO_PRECISION_R3_BEGIN
   Header contract is scoped to R12. The source icons are complete crops from
   the user-approved 1672x941 reference; no shell stylesheet is edited. */
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header {
  display: grid;
  grid-template-columns: 28px minmax(0,1fr) auto;
  grid-template-rows: minmax(34px,auto);
  align-items: center;
  gap: 8px;
  min-width: 0;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header::before,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header::before {
  content: "";
  display: block;
  grid-column: 1;
  grid-row: 1;
  width: 28px;
  height: 28px;
  min-width: 28px;
  margin: 0;
  padding: 0;
  position: static;
  opacity: 1;
  background-color: transparent;
  background-repeat: no-repeat;
  background-size: 28px 28px;
  background-position: 50% 50%;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header::before {
  background-image: url('/r4/grazing-r12-icons/sec-events-complete-r12.png');
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header::before {
  background-image: url('/r4/grazing-r12-icons/sec-supplement-complete-r12.png');
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header .g12-title,
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header .g12-title {
  grid-column: 2;
  grid-row: 1;
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  font-size: clamp(12px,.96vw,17px);
  line-height: 1.2;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header > :is([data-detail]:not(.g12-title), [data-action]),
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header > :is([data-detail]:not(.g12-title), [data-action]) {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  margin: 0;
  font-size: clamp(9px,.67vw,11px);
  padding: 5px 7px;
  white-space: nowrap;
}
/* Green positive actions and white/green Cancel/Close remain as approved. */
@media (max-width: 1349px) {
  body[data-r4-view="grazing"] .g12-card[data-card-detail="events"] > header .g12-title,
  body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header .g12-title {
    font-size: 12px;
  }
  body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header > [data-action] {
    padding: 4px 5px;
    font-size: 9px;
  }
}
/* R12 host and its existing internal table scrollers are retained. */
/* AGX_R12_GANADERO_PRECISION_R3_END */

/* AGX_R12_SUPPLEMENT_HEADER_EXACT_R5_BEGIN */
/* Two clearly separated rows prevent the action from truncating the title.
   This affects only the R12 supplement card; the official shell is frozen. */
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: minmax(28px, auto) minmax(29px, auto);
  column-gap: 8px;
  row-gap: 2px;
  align-items: center;
  min-height: 59px;
  margin-bottom: 4px;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header::before {
  grid-column: 1;
  grid-row: 1;
  width: 28px;
  height: 28px;
  min-width: 28px;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header > .g12-title {
  grid-column: 2;
  grid-row: 1;
  justify-self: start;
  align-self: center;
  display: block;
  width: max-content;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
  white-space: nowrap;
  text-overflow: clip;
  font-size: clamp(12px, .96vw, 16px);
  line-height: 1.2;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header > button[data-action="supplement"] {
  grid-column: 2;
  grid-row: 2;
  justify-self: end;
  align-self: center;
  min-height: 29px;
  margin: 0;
  padding: 5px 9px;
  font-size: clamp(10px, .73vw, 11px);
  line-height: 1.15;
  font-weight: 700;
  white-space: nowrap;
  background: #087443;
  border-color: #087443;
  color: #fff;
}
body[data-r4-view="grazing"] .g12-card[data-card-detail="supplements"] > header > button[data-action="supplement"]:hover {
  background: #065c35;
  border-color: #065c35;
  color: #fff;
}
/* AGX_R12_SUPPLEMENT_HEADER_EXACT_R5_END */